@charset "UTF-8"; /* CSS Document */ //繝悶Ξ繧、繧ッ繝昴う繝ウ繝医r謖�ョ�------縺薙%縺九i $xl: 1399px; $lg: 1199px; $md: 991px; $sm: 767px; $xs: 575px; @mixin xl { @media screen and (max-width: ($xl)) { @content; } } @mixin lg { @media screen and (max-width: ($lg)) { @content; } } @mixin md { @media screen and (max-width: ($md)) { @content; } } @mixin sm { @media screen and (max-width: ($sm)) { @content; } } @mixin xs { @media screen and (max-width: ($xs)) { @content; } } //繝悶Ξ繧、繧ッ繝昴う繝ウ繝医r謖�ョ�------縺薙%縺セ縺ァ $bright-color: #b20404; $dark-color: #602121; #visiting p { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "繝。繧、繝ェ繧ェ", Meiryo, "�ュ�ウ 繧エ繧キ繝�け", sans-serif; font-family: 'Noto Sans JP'; line-height: 2; font-size: 15px; font-size: 1.5rem; text-align:justify; @include lg { line-height: 1.7; // font-size: 12px; // font-size: 1.2rem; } } .top { background-image: url("../img/visiting-head.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; margin-top:91px; @include md { margin-top:85px; } @include sm { margin-top:-120px; background-image: url("../img/visiting-head-sm.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; } @include xs { margin-top:-194px; } } .feature-width { padding: 0rem 20rem 0rem 20rem; @include xl { padding: 0rem 12rem 0rem 12rem; } @include lg { padding: 0rem 8rem 0rem 8rem; } @include md { padding: 0rem 6rem 0rem 6rem; } @include xs { padding: 0rem 2rem 0rem 2rem; } } .feature-1 { h3 { font-size: 4rem; font-size: 40px; font-weight:200; padding:100px 0px 29px 0px ; line-height: 7.5rem; @include lg { padding:45px 0px 16px 0px ; font-size: 3.5rem; font-size: 35px; } @include md { padding:43px 0px 16px 0px ; font-size: 2.8rem; font-size: 28px; line-height: 6.3rem; } @include sm { padding:437px 0px 16px 0px ; } @include xs { padding:343px 0px 16px 0px ; } } .red { color: $bright-color; font-size: 5.5rem; font-size: 55px; letter-spacing: 0.12em; @include lg { font-size: 5.0rem; font-size: 50px; } @include md { font-size: 4rem; font-size: 40px; } } .title { font-size: 55px; font-size: 5.5rem; letter-spacing: 0.12em; @include lg { font-size: 5.0rem; font-size: 50px; } @include md { font-size: 4rem; font-size: 40px; } } p { padding-bottom: 35rem; text-align:justify; color: #000; text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0-1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF; @include xl { padding-bottom: 24rem; } @include lg { padding-bottom: 20rem; } @include md { padding-bottom: 10rem; } @include sm { padding-bottom: 28rem; } @include xs { padding-bottom: 11rem; } } } .feature { h3 { font-size: 3.7rem; font-size: 37px; font-weight:100; padding:21px 0px 9px 0px ; line-height: 4.5rem; letter-spacing: 0.12em; @include lg { padding:0px 0px 9px 0px ; } @include md { font-size: 2.7rem; font-size: 27px; padding:0px 0px 0px 0px ; } } h4 { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "繝。繧、繝ェ繧ェ", "Meiryo", "�ュ�ウ 繧エ繧キ繝�け", sans-serif; font-family: 'Noto Sans JP'; line-height: 2; font-size: 18px; font-size: 1.8rem; font-weight: 600; margin: 0rem 0rem 1.5rem; @include md { margin: 2rem 0rem 1rem; line-height: 1.5; } } span { color: $bright-color; font-size: 4.8rem; font-size: 48px; @include md { font-size: 3.7rem; font-size: 37px; } } } .feature-2 { h3 { font-size: 3.7rem; font-size: 37px; font-weight:100; padding:21px 0px 9px 0px ; line-height: 4.5rem; letter-spacing: 0.12em; @include lg { padding:0px 0px 9px 0px ; } @include md { font-size: 2.7rem; font-size: 27px; padding:0px 0px 0px 0px ; } } h4 { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "繝。繧、繝ェ繧ェ", "Meiryo", "�ュ�ウ 繧エ繧キ繝�け", sans-serif; font-family: 'Noto Sans JP'; line-height: 2; font-size: 18px; font-size: 1.8rem; font-weight: 600; margin: 0rem 0rem 1.5rem; @include md { margin: 2rem 0rem 1rem; line-height: 1.5; } } span { color: $bright-color; font-size: 4.8rem; font-size: 48px; @include md { font-size: 3.7rem; font-size: 37px; } } } .feature-img { position: relative; .box{ position: absolute; top: -88px; left: 771px; z-index: 1; @include xl { top: -69px; left: 731px; } @include lg { top: -70px; left: 616px; } @include md { top: -58px; left: 505px; } @include sm { top: 507px; left: -20px; width: 45%; } @include xs { left: 0px; } } } .mall { @include sm { text-align: center; padding-top: 3rem; } } .matrix { @include sm { text-align: center; padding-bottom: 4rem; } } .back { background-image: url("../img/background.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover; padding:5rem 0rem 8rem 0rem; @include xl { padding:5rem 0rem 8rem 0rem; } @include md { padding:5rem 0rem 5rem 0rem; } } .back-2 { padding:7rem 0rem 7rem 0rem; } .info { position: relative; .box2{ position: absolute; bottom: -49px; left: -45px; z-index: 1; img { width: 84%; @include xl { width: 69%; } } @include xl { left: 4px; } } } .info-img { text-align: center; } .SPOT { margin: 7rem 0rem 9rem 0rem; padding: 0rem 20rem 0rem 20rem; @include xl { padding: 0rem 12rem; } @include lg { padding: 0rem 3rem; } @include md { padding: 0rem; } h2 { margin-bottom: 5rem; } .row { background-color: #f0eae1; padding: 0rem; margin: 3rem 0rem 3rem 0rem; @include sm { padding: 2rem; } } h3 { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "繝。繧、繝ェ繧ェ", Meiryo, "�ュ�ウ 繧エ繧キ繝�け", sans-serif; font-family: 'Noto Sans JP'; line-height: 2; font-size: 24px; font-size: 2.4rem; font-weight: 600; margin: 0rem 0rem 1.5rem; border-bottom: solid #000 1px; padding-bottom:5px; } h4 { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "繝。繧、繝ェ繧ェ", Meiryo, "�ュ�ウ 繧エ繧キ繝�け", sans-serif; font-family: 'Noto Sans JP'; line-height: 2; font-size: 18px; font-size: 1.8rem; font-weight: 600; margin: 0rem 0rem 0.5rem; @include md { line-height: 1.5; margin: 2rem 0rem 0.5rem; } .visiting-SPOT-5 { margin-bottom: 8rem; } } img { width: 100%; height: 100%; object-fit: cover; } dt { padding: 0rem; } dd { padding: 3rem; @include sm { padding: 1rem 0.5rem 0.5rem 0.5rem; } } }