@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";
@charset "utf-8";

 html{
font-size: 10px;
font-family:  "游ゴシック体", "Yu Gothic", YuGothic, Meiryo, "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic",  Osaka, sans-serif;
color: #000000;
line-height: 1.5;
letter-spacing: 0.075em;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-moz-font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
font-feature-settings: "palt";
overflow-x: hidden;
} header, footer, section, article, aside, nav,
figure, figcaption, main {
display: block;
}
body{
overflow-x: hidden;
width: 100%;
margin: 0;
padding: 0;
}
main{padding-bottom: 60px;}
img {
display: block;
width: 100%;
height: auto;
padding: 0;
margin: 0;
vertical-align: middle;
border:none;
}
img[src*='.svg']{
width: 100%;
height: auto;
}
a,a:visited{
color: #FFF;
text-decoration: none;
-webkit-transition:opacity .4s;
transition:opacity .4s;
}
:focus{outline:none;background-color: transparent;}
button:focus{outline:none;background-color: transparent;}
.hover{-webkit-transition:opacity .4s;transition:opacity .4s;cursor: pointer;}
a:hover,.hover:hover{opacity: 0.5;}
div,main,header,footer,nav,section,p,ul,ol,dl,li,dt,dd,a,span,h1,h2,h3,h4,h5,h6,table,tr,th,td,figure,figcaption{
margin: 0;
padding: 0;
box-sizing: border-box;
}
section{position: relative;}
ul,ol,dl,li,dt,dd{list-style: none;}
label{color:inherit;}
br{
line-height: initial;
}
.cf:after{
content: "";
display: block;
clear: both;
}
.ofi{
width: 100%;
height: 100%;
object-fit: cover;
font-family: 'object-fit: cover;'
}
input:not([type]), input[type=text]:not(.browser-default), input[type=password]:not(.browser-default), input[type=email]:not(.browser-default), input[type=url]:not(.browser-default), input[type=time]:not(.browser-default), input[type=date]:not(.browser-default), input[type=datetime]:not(.browser-default), input[type=datetime-local]:not(.browser-default), input[type=tel]:not(.browser-default), input[type=number]:not(.browser-default), input[type=search]:not(.browser-default), textarea.materialize-textarea{
border: none;
margin: 0;
padding-left: 1em;
box-sizing: border-box;
}
input:not([type]):focus:not([readonly]), input[type=text]:not(.browser-default):focus:not([readonly]), input[type=password]:not(.browser-default):focus:not([readonly]), input[type=email]:not(.browser-default):focus:not([readonly]), input[type=url]:not(.browser-default):focus:not([readonly]), input[type=time]:not(.browser-default):focus:not([readonly]), input[type=date]:not(.browser-default):focus:not([readonly]), input[type=datetime]:not(.browser-default):focus:not([readonly]), input[type=datetime-local]:not(.browser-default):focus:not([readonly]), input[type=tel]:not(.browser-default):focus:not([readonly]), input[type=number]:not(.browser-default):focus:not([readonly]), input[type=search]:not(.browser-default):focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]){
border: none;
box-shadow: none;
}
[type="checkbox"]+span:not(.lever):before, [type="checkbox"]:not(.filled-in)+span:not(.lever):after {
border-color: #fff;
}
[type="checkbox"]:checked+span:not(.lever):before {
border-right-color: #fff;
border-bottom-color: #fff;
}
[type="radio"]:not(:checked)+span:before, [type="radio"]:not(:checked)+span:after {
border-color: #fff;
}
[type="radio"]:checked+span:after, [type="radio"].with-gap:checked+span:after {
background-color: #fff;
}
[type="radio"]:checked+span:after, [type="radio"].with-gap:checked+span:before, [type="radio"].with-gap:checked+span:after {
border-color: #fff;    
}
textarea {
height: 100%;
min-height: 20em;
margin: 0;
padding: 0;    
} h1, h2, h3, h4, h5, h6 {
font-weight: 400;
line-height: 1.25;
letter-spacing: 0.075em;
margin: 0;
padding: 0;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
font-weight: inherit;
}
h1 {
font-size: 1.285rem;
}
h2 {
font-size: 1.185rem;
}
h3 {
font-size: 1rem;
}
h4 {
font-size: 1rem;
}
h5 {
font-size: 1rem;
}
h6 {
font-size: 1rem;
}
em {
font-style: italic;
}
strong {
font-weight: 500;
}
small {
font-size: 75%;
}
p{
font-size: 1rem;
line-height: 1.25;
letter-spacing: 0.01em;
}
@media screen and (max-width: 959px) {
p {text-align: justify;}
} .yugo{font-family:  "游ゴシック体", "Yu Gothic", YuGothic, Meiryo, "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic",  Osaka, sans-serif;}
.yumin{	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.font-roboto{font-family: 'Roboto', sans-serif;}
.font-robotoC{font-family: 'Roboto Condensed', sans-serif;}
.font-HVM{font-family: 'Herr Von Muellerhoff', cursive;}
.libre-basker{font-family: 'Libre Baskerville', serif;}
.noto-serif{font-family: 'Noto Serif', 'Noto Serif JP', serif;} .fl {float: left;}
.fr {float: right;} .tal {text-align: left !important;}
.tac {text-align: center !important;}
.tar {text-align: right !important;}
.taj {text-align: justify !important;}
@media screen and (max-width: 959px) {
.sp-tal {text-align: left !important;}
.sp-tac {text-align: center !important;}
.sp-tar {text-align: right !important;}
.sp-taj {text-align: justify !important;}
.sp-tal * {text-align: left !important;}
.sp-tac * {text-align: center !important;}
.sp-tar * {text-align: right !important;}
.sp-taj * {text-align: justify !important;}
} .mauto {display: block;margin-left: auto !important;margin-right: auto !important;}
.m00 {margin: 0 !important;}
.mb {margin-bottom: 1.5em !important;}
.mb00 {margin-bottom: 0 !important;}
.mb05 {margin-bottom: 5px !important;}
.mb08 {margin-bottom: 8px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb25 {margin-bottom: 25px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb35 {margin-bottom: 35px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb45 {margin-bottom: 45px !important;}
.mb50 {margin-bottom: 50px !important;}
.mt {margin-top: 1.5em !important;}
.mt00 {margin-top: 0 !important;}
.mt05 {margin-top: 5px !important;}
.mt08 {margin-top: 8px !important;}
.mt10 {margin-top: 10px !important;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt25 {margin-top: 25px !important;}
.mt30 {margin-top: 30px !important;}
.mt35 {margin-top: 35px !important;}
.mt40 {margin-top: 40px !important;}
.mt45 {margin-top: 45px !important;}
.mt50 {margin-top: 50px !important;}
.ml05 {margin-left: 5px !important;}
.ml08 {margin-left: 8px !important;}
.ml10 {margin-left: 10px !important;}
.ml15 {margin-left: 15px !important;}
.ml20 {margin-left: 20px !important;}
.mr05 {margin-right: 5px !important;}
.mr08 {margin-right: 8px !important;}
.mr10 {margin-right: 10px !important;}
.mr15 {margin-right: 15px !important;}
.mr20 {margin-right: 20px !important;} .p00 {padding: 0 !important;}
.pb {padding-bottom: 1.3em !important;}
.pb00 {padding-bottom: 0 !important;}
.pb05 {padding-bottom: 5px !important;}
.pb08 {padding-bottom: 8px !important;}
.pb10 {padding-bottom: 10px !important;}
.pb15 {padding-bottom: 15px !important;}
.pb20 {padding-bottom: 20px !important;}
.pb25 {padding-bottom: 25px !important;}
.pb30 {padding-bottom: 30px !important;}
.pb35 {padding-bottom: 35px !important;}
.pb40 {padding-bottom: 40px !important;}
.pb45 {padding-bottom: 45px !important;}
.pb50 {padding-bottom: 50px !important;}
.pt00 {padding-top: 0 !important;}
.pt05 {padding-top: 5px !important;}
.pt08 {padding-top: 8px !important;}
.pt10 {padding-top: 10px !important;}
.pt15 {padding-top: 15px !important;}
.pt20 {padding-top: 20px !important;}
.pt25 {padding-top: 25px !important;}
.pt30 {padding-top: 30px !important;}
.pt35 {padding-top: 35px !important;}
.pt40 {padding-top: 40px !important;}
.pt45 {padding-top: 45px !important;}
.pt50 {padding-top: 50px !important;}
.pl00 {padding-left: 0px !important;}
.pl05 {padding-left: 5px !important;}
.pl08 {padding-left: 8px !important;}
.pl10 {padding-left: 10px !important;}
.pl15 {padding-left: 15px !important;}
.pl20 {padding-left: 20px !important;}
.pr05 {padding-right: 5px !important;}
.pr08 {padding-right: 8px !important;}
.pr10 {padding-right: 10px !important;}
.pr15 {padding-right: 15px !important;}
.pr20 {padding-right: 20px !important;}
.pbox {padding: 5px 10px;}
.pbox00 {padding: 1% 5%;}
.pbox01 {padding: 10px;}
.pbox02 {padding: 20px;}
.pbox03 {padding: 30px;}
.pbox04 {padding: 40px;}
.pbox05 {padding: 50px;} .fz8  {font-size:  8px; font-size: 0.8rem;}
.fz9  {font-size:  9px; font-size: 0.9rem;}
.fz10 {font-size: 10px; font-size: 1.0rem;}
.fz11 {font-size: 11px; font-size: 1.1rem;}
.fz12 {font-size: 12px; font-size: 1.2rem;}
.fz13 {font-size: 13px; font-size: 1.3rem;}
.fz14 {font-size: 14px; font-size: 1.4rem;}
.fz15 {font-size: 15px; font-size: 1.5rem;}
.fz16 {font-size: 16px; font-size: 1.6rem;}
.fz17 {font-size: 17px; font-size: 1.7rem;}
.fz18 {font-size: 18px; font-size: 1.8rem;}
.fz19 {font-size: 19px; font-size: 1.9rem;}
.fz20 {font-size: 20px; font-size: 2.0rem;} .fsi {font-style: italic;}
.fso {font-style: oblique;} .ruby {
position: relative;
}
.ruby:after {
content: '・';
position: absolute;
top: -0.75em;
left: 0;
width: 1em;
letter-spacing: 2px;
}
.ruby02:after {
content: '・・';
width: 2em;
}
.ruby03:after {
content: '・・・';
width: 3em;
} .ti-04{
text-indent: -0.4rem;
} .wauto{
width: auto !important;
}
.w100p{
width: 100% !important;
max-width: 100% !important;
}
.w300{width: 300px;} .separator{
width: 20px;
height: 1px;
margin: 1.5em 0;
display: block;
} .round{border-radius: 500px;}
.sp-no-round{border-radius: none;} .white01{color: #fff !important;}
.white01 a{color: #fff !important;}
.white01 a:hover{color: #000 !important;}
.black01{color: #000 !important;}
.black01 a{color: #000 !important;}
.black01 a:hover{color: #fff !important;}
.gray01{color: #3C3C3C !important;}
.gray02{color: #5a5a5a !important;}
.gray03{color: #828282 !important;}
.gray01 a{color: #3C3C3C !important;}
.gray02 a{color: #5a5a5a !important;}
.gray03 a{color: #828282 !important;}
.gray01 a::before{background-color: #3C3C3C !important;}
.gray02 a::before{background-color: #5a5a5a !important;}
.gray03 a::before{background-color: #828282 !important;}
.gray01 a::after{border-color: #3C3C3C !important;}
.gray02 a::after{border-color: #5a5a5a !important;}
.gray03 a::after{border-color: #828282 !important;}
.ocher01 {color: #a38c00 !important;}
.bg-transparent{background-color: transparent !important;}
.bg-white{color: #000;background-color: #fff !important;opacity:0.8;}
.bg-white01{color: #3C3C3C;background-color: #fff !important;}
.bg-white02{color: #3C3C3C;background-color: #fff !important;opacity:0.8;}
.bg-white03{color: #000;background-color: #f5f5f5 !important;}
.bg-white04{color: #646464;background-color: #f5f5f5 !important;}
.bg-black{color: #fff;background-color: #000 !important;opacity:0.8;}
.bg-gray01{color: #FFF;background-color: #3C3C3C !important;}
.bg-gray02{color: #FFF;background-color: #5a5a5a !important;}
.bg-gray03{color: #FFF !important;background-color: #828282 !important;}
.bg-gray04{background-color: #C8C8C8 !important;}
.bg-gray05{background-color: #e6e6e6 !important;}
.bg-gray06{color: #FFF;background-color: #646464 !important;}
.bg-ocher{background-color: #F5F3E4 !important;} .opacity01{opacity: 1;}
.opacity02{opacity: 0.8;}
.opacity03{opacity: 0.5;}
.opacity04{opacity: 0.2;}
.opacity05{opacity: 0;} .bbb{
border-bottom: solid 1px #000 !important;
margin-bottom: 0.5em !important;
padding-bottom: 0.5em !important;
}
.bbb01{
border-bottom: solid 1px #000 !important;
margin-bottom: 0.25em !important;
padding-bottom: 5px !important;
}
.bbb02{
border-bottom: solid 1px #000 !important;
margin-bottom: 1em !important;
padding-bottom: 1em !important;
}
.bbw{
border-bottom: solid 1px #fff !important;
margin-bottom: 0.5em !important;
padding-bottom: 0.5em !important;
}
.b-color-b{
border-color: #000 !important;
}
.b-color-b01{
border-color: #646464 !important;
}
.b-box-b{
border: solid 1px #000;
}
.b-box-b01{
border: solid 1px #646464;
}
.b-box-b-side-only{
padding: 0 1em;
border-left: solid 1px;
border-right: solid 1px;
border-color: #000;
}
.b-box-w-side-only{
padding: 0 1em;
border-left: solid 1px;
border-right: solid 1px;
border-color: #fff;
}
.bw01{
border-width: 1px;
}
.bw02{
border-width: 2px;
}
a.under-line-link{ word-wrap: break-word;text-decoration: none;}
a.under-line-link:hover{text-decoration: underline;-webkit-transition:all .3s;transition:all .3s;-webkit-transition:all all .3s ease;-moz-transition:all all .3s ease;-ms-transition:all all .3s ease;-o-transition:all all .3s ease;transition:all all .3s ease;} .btn {
background-color: transparent;
color: transparent;
text-align: center;
padding: 0;
min-width: 130px;
margin-bottom: 1em;
box-shadow: none;
text-transform: none;
height: 32px;
line-height: 32px;
}
.btn:hover {
background-color: transparent;
color: transparent;
}
.btn a {
width: 100%;
display: block;
padding: 0;
border: solid 1px;
}
.btn:hover, .btn-large:hover, .btn-small:hover, .btn-floating:hover {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn a:hover {
opacity: 1;
}
.btn.txt-black {
color: #000 !important;
border-color: #000;
}
.btn.txt-black a {
color: #000 !important;
}
.btn.txt-black:hover a {
color: #fff !important;
background-color: #000 !important;
border: none;
}
.btn.txt-gray {
color: #3C3C3C !important;
border-color: #3C3C3C;
}
.btn.txt-gray a {
color: #3C3C3C !important;
}
.btn.txt-gray:hover a {
color: #fff !important;
background-color: #000 !important;
border: none;
}
.btn.txt-white {
color: #fff !important;
}
.btn.txt-white a {
color: #fff !important;
}
.btn.txt-white:hover a {
color: #000 !important;
background-color: #fff;
border: none;
}
.round-btn a {
border-radius: 5px;
}
@media screen and (max-width: 959px) {
.btn {
width: 100%;
display: block;
}
.btn a {
margin: 0 auto;
display: block;
}
.btn-left a {
margin-left: 0;
}
.btn-center a {
}
.btn-right a {
margin-right: 0;
}
}
.linkBtn{
top: 0px;
right: 0px;
width: 120px;
height: 80px;
}
.linkBtn p{
font-size: 12px;
}
.linkBtn + .linkBtn{
top: 0px;
right: -120px;
}
.linkBtn01{
background-color: #f5f5f5;
color: #646464;
}
.linkBtn01 a{
color: #646464 !important;
}
.linkBtn02{
background-color: #646464;
color: #ffffff;
}
.linkBtn02 a{
color: #ffffff !important;
}
.arrow{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
color: #3C3C3C;
vertical-align: middle;
text-decoration: none;
font-size: 15px;
}
.arrow::before,
.arrow::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.next-arrow01 {
position: relative;
display: block;
}
.next-arrow01:after {
content: "";
display: block;
width: 35px;
height: 35px;
border-style: solid;
border-width: 1px 1px 0 0;
position: absolute;
top: 50%;
right: 5%;
transform: translateY(-50%) translateX(0%) rotate(45deg);
-webkit- transform: translateY(-50%) translateX(0%) rotate(45deg);
}
.next-arrow01.border-white:after {
border-top-color: #fff;
border-right-color: #fff;
}
.next-arrow01.border-black:after {
border-top-color: #000;
border-right-color: #000;
}
.next-arrow02 {
position: relative;
display: block;
}
.next-arrow02:before,
.next-arrow02:after {
content: "";
display: block;
width: 0;
height: 0;
position: absolute;
border-style: solid;
border-width: 30px 0 30px 15px;
top: 50%;
right: 5%;
transform: translateY(-50%) translateX(0%);
-webkit- transform: translateY(-50%) translateX(0%);
}
.next-arrow02.border-white:before {
right: calc(5% - 2px);
border-color: transparent transparent transparent #fff;
}
.next-arrow02.border-black:before {
right: calc(5% - 2px);
border-color: transparent transparent transparent #000;
}
.next-arrow02.border-white:after {
right: 5%;
border-color: transparent transparent transparent #000;
}
.next-arrow02.border-black:after {
right: 5%;
border-color: transparent transparent transparent #fff;
}
.more-link {text-align:right;font-size:14px;}
.more-link a {margin:1.5em 0;padding-right:90px;display:inline-block;color:#fff;}
.more-link a::before{
top: 0px;
right: -70px;
width: 70px;
height: 1px;
background: #fff;
}
.more-link a::after{
right: -133px;
width: 7px;
height: 7px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
@-webkit-keyframes sdb {
0% {
width: 0;
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -70px;
opacity: 0;
}
}
@keyframes sdb {
0% {
width: 0;
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -70px;
opacity: 0;
}
}
@-webkit-keyframes sdb2 {
0% {
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
right: -133px;
opacity: 0;
}
}
@keyframes sdb2 {
0% {
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
right: -133px;
opacity: 0;
}
}
.more-link a:hover::before {
-webkit-animation: sdb 1.5s infinite;
animation: sdb 1.5s infinite;    
}
.more-link a:hover::after {
-webkit-animation: sdb2 1.5s infinite;
animation: sdb2 1.5s infinite;
}
.more-link01{}
.more-link01 a{}
.more-link01::after {}
.more-link01:hover {}
.more-link02 {
position: absolute;
bottom: 0;
right: 0;
}
.more-link02 + .more-link02 {
bottom: 55px;
}
.more-link02 a {
margin: 0.25em 0.5em;
padding-left: 1em;
padding-right: 135px;
display: inline-block;
color: #fff;
width: 320px;
text-align: left;
}
.more-link02 a::before{
top: 0px;
right: -200px;
width: 70px;
height: 1px;
background: #fff;
}
.more-link02 a::after{
right: -263px;
width: 7px;
height: 7px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
@-webkit-keyframes sdb02 {
0% {
width: 0;
right: -133px;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -200px;
opacity: 0;
}
}
@keyframes sdb02 {
0% {
width: 0;
right: -133px;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -200px;
opacity: 0;
}
}
@-webkit-keyframes sdb2_02 {
0% {
right: -133px;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
right: -263px;
opacity: 0;
}
}
@keyframes sdb2_02 {
0% {
right: -133px;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
right: -263px;
opacity: 0;
}
}
.more-link02 a:hover::before {
-webkit-animation: sdb02 1.5s infinite;
animation: sdb02 1.5s infinite;    
}
.more-link02 a:hover::after {
-webkit-animation: sdb2_02 1.5s infinite;
animation: sdb2_02 1.5s infinite;
}
.more-link03 {text-align: center;}
.more-link03 a{margin: 0;}
.more-link03::after {}
.more-link03:hover {}
.more-link04 {
text-align: right;
margin-right: -20px;
}
.more-link04 a{
margin: 0;
padding-right: 120px;
}
.more-link04::after {}
.more-link04:hover {}
.more-link05 {
bottom: 0px;
right: -70px;
}
.more-link05 a{
width: 420px;
text-align: right;
padding-right: 150px;
}
.more-link05::after {}
.more-link05:hover {}
.youtube_btn {
cursor: pointer;
width: 95px;
height: 31px;
display: -webkit-flex;
display: -ms-flex;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background: none;
border: 1px solid;
padding: .3em 1em;
margin-left: 20px;
}
.totop {
width: 50px;
position: fixed;
bottom: 50px;
right: 50px;
} .pager {
position: relative;
height: 100px;
}
.pagination {
width: auto;
}
.pagination li a,
.pagination li span {
color: #646464;
display: inline-block;
font-size: 1rem;
padding: 0 5px;
line-height: 30px;
} .scroll-point{
position: absolute;
bottom: 33px;
left: calc(50% - 8px);
width: 16px;
height: 26px;
border: solid 1px #FFF;
border-radius: 8px;
z-index: 99;
}
.scroll-point div{
position: absolute;
top: 4px;
left: calc(50% - 3px);
width: 6px;
height: 6px;
background-color: #FFF;
border-radius: 100%;
animation-name: point-anime;
animation-duration: 1.5s;
animation-delay: 0.5s;
animation-iteration-count: infinite;
animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.25);
animation-direction: normal;
}
@keyframes point-anime{
0%{top: 4px;}
33%{top: 14px;}
70%{top: 14px;}
80%{top: 14px;opacity: 0;}
90%{top: 4px;opacity: 0;}
100%{top: 4px;opacity: 1;}
}
.scroll-point01{
position: absolute;
bottom: 33px;
left: 12px;
width: 50px;
height: 170px;
z-index: 99;
}
.scroll-point01:before{
content: 'Scroll';
font-size: 10px;
position: absolute;
top: 0;
left: calc(50% - 8px);
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
.scroll-point01 div{
position: absolute;
top: 40px;
left: calc(50% - 2px);
width: 1px;
height: 130px;
background-color: #000;
animation-name: point-anime01;
animation-duration: 1.5s;
animation-delay: 0.5s;
animation-iteration-count: infinite;
animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.25);
animation-direction: normal;
}
.youtube{
position: absolute;
bottom: 2%;
right: 1.25%;
z-index: 100;
}
@keyframes point-anime01{
0%{height: 4px;}
70%{height: 130px;}
80%{height: 130px;opacity: 0;}
90%{height: 4px;opacity: 0;}
100%{height: 4px;opacity: 1;}
} .inner{
max-width: 960px;
margin: 0 auto;
}
.left00{
width: 50%;
}
.left01{
width: calc(100% - 240px);
}
.left02{
width: calc(100% - 400px);
}
.left03{
width: 200px;
margin-right: 40px;
}
.left04{
width: 140px;
margin-right: 20px;
}
.right00{
width: 50%;
}
.right01{
width: 200px;
margin-left: 40px;
}
.right02{
width: 200px;
margin-left: 200px;
}
.right03{
width: calc(100% - 240px);
}
.right04{
width: calc(100% - 160px);
}
.right05{
width: calc(100% - 300px);
}
.txt{
font-size: 14px;
text-align: justify;
line-height: 1.5;
letter-spacing: 0.05em;
overflow-wrap: break-word;
}
.bgImg {
position: relative;
}
.bgImg > .leftTxt {
position: absolute;
bottom: 1em;
left: 1em;
}
.bgImg > .rightTxt {
position: absolute;
bottom: 1em;
right: 1em;
}
a.wink:hover img {opacity: 0.8;}
.line-text {
margin-bottom: 0 !important;
display: flex;
align-items: center;
}
.line-text:before{
content: "";
flex-grow: 1;
height: 1px;
background: #646464;
margin:0 45px 0 0;
}
.line-text:after{
content: "";
flex-grow: 1;
height: 1px;
background: #646464;
margin:0 0 0 45px;
} .block {
display: block !important;
}
.iblock {
display: inline-block !important;
}
.dnone {
display: none;
}
.flex{
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.flex-start {
justify-content: flex-start !important;
}
.flex-end {
justify-content: flex-end !important;
}
.space-between {
justify-content: space-between !important;
}
.flex.mono .box{width: 100%;}
.flex.di .box{width: 48.083333%;}
.flex.di.narrow .box{width: calc((100% - 2px) / 2);margin-bottom:1px;}
.flex.di.narrow01 .box{width: calc((100% - 10px) / 2);margin-bottom:10px;}
.flex.tri .box{width: 32.083333%;margin-bottom:20px;}
.flex.tri.narrow .box{width: calc((100% - 2px) / 3);margin-bottom:1px;}
.flex.tetra .box{width: 24.083333%;}
.flex.tetra.narrow .box{width: calc((100% - 3px) / 4);margin-bottom:1px;}
.box-wrapper {
position: relative;
width: 100%;
}
.box-wrapper:before {
content:"";
display: block;
padding-top: 100%; }
.box-wrapper > * {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.nobr br {
content: '';
}
.nobr br:after {
margin-right: -.333em;
content: '';
}
.center-flex{
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.vmiddle-flex{
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.bottom-flex{
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: flex-end;
-webkit-align-items: flex-end;
-ms-flex-align: flex-end;
align-items: flex-end;
}
.relative{position: relative;}
.abs{position: absolute;}
.center-abs{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
.center-abs2{
position: absolute;
left: 50%;
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
}
.vmiddle-abs{
position: absolute;
top: 50%;
transform: translate(0%, -50%);
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
}
.top-abs{
position: absolute;
top: 0;
bottom: auto !important;
}
.bottom-abs{
position: absolute;
bottom: 0;
top: auto !important;
}
.bottom-abs2{
position: absolute;
bottom: -1em;
top: auto !important;
}
.left-abs{
position: absolute;
left: 0;
right: auto !important;
}
.right-abs{
position: absolute;
right: 0;
left: auto !important;
}
.overtext {
position: absolute;
bottom: 0;
left: 1.5rem;
font-size: 14px;
line-height: 1;
letter-spacing: 0.03em;
} .fadein {
animation: fadeIn 10s ease 0s 1 normal;
-webkit-animation: fadeIn 10s ease 0s 1 normal;
}
@keyframes fadeIn {
0% {opacity: 0}
20% {opacity: 0}
60% {opacity: 1}
100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
0% {opacity: 0}
20% {opacity: 0}
60% {opacity: 1}
100% {opacity: 1}
}
.mobile .youtube.fadein {
animation: fadeIn2 10s ease 0s 1 normal;
-webkit-animation: fadeIn2 10s ease 0s 1 normal;
}
@keyframes fadeIn {
0% {opacity: 0}
50% {opacity: 0}
100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
0% {opacity: 0}
50% {opacity: 0}
100% {opacity: 1}
}
.fadeout {
animation: fadeOut 5s ease 0s 1 normal;
-webkit-animation: fadeOut 5s ease 0s 1 normal;
}
@keyframes fadeOut {
0% {opacity: 1}
100% {opacity: 0}
}
@-webkit-keyframes fadeOut {
0% {opacity: 1}
100% {opacity: 0}
} .dropshadow {
-webkit-filter:drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.75));
-moz-filter:drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.75));
-ms-filter:drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.75));
filter:drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.75));
}
.dropshadow01 {
-webkit-filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
-moz-filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
-ms-filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
filter:drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
} .parallax{
min-height: 300px;
background-position: center top;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;    
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; } .row{
margin-bottom: 50px;
}
.row:last-child{
margin-bottom: 0;
}
.row .col{padding:0;}
.row .col.gap{padding:0 .5rem}
.row .col.gap:first-child{padding-left:0;padding-right:1rem;}
.row .col.gap:last-child{padding-left:1rem;padding-right:0}
.col .row {
margin: 0;
}
.slider {
height: auto;
} .pc { display: block !important; }
.sp { display: none !important; }  @media screen and (max-width: 1199px) {
.left02{
width: calc(100% - 240px);
}
.right02{
width: 200px;
margin-left: 40px;
}    
}  @media screen and (max-width: 959px) { main{padding-bottom: 0px;}
.inner{width: 85%;}
.inner .inner{width: 100%;}
.spbr{display: block;}
.spbr br {
content: '';
}
.spbr br:after {
margin-right: -.333em;
content: '';
}
.pc { display: none !important; }
.sp { display: block !important; }
.left00, .left01, .left02, .left03, .left04, .left05{
width: 100%;
}
.right00, .right01, .right02, .right03, .right04, .right05{
width: 100%;
margin-left: 0;
}
.pbox {padding: 5px 10px;}
.pbox00 {padding: 1% 5%;}
.pbox01 {padding: 10px;}
.pbox02 {padding: 20px;}
.pbox03 {padding: 20px;}
.pbox04 {padding: 20px;}
.pbox05 {padding: 30px;}
.sp-no-round{border-radius: 0;}
}  @media screen and (max-width: 767px) {
html{
overflow-x: hidden;
}
}  @media screen and (max-width: 479px) {
.flex{display: block;}
.flex.di .box{width: 100%;margin-left: auto;margin-right: auto;}
.flex.di.narrow .box{width: 100%;margin-left: auto;margin-right: auto;}
.flex.di.narrow01 .box{width: 100%;margin-left: auto;margin-right: auto;}
.flex.tri .box{width: 100%;max-width: 295px;margin-left: auto;margin-right: auto;}
.flex.tri.narrow .box{width: 100%;max-width: 295px;margin-left: auto;margin-right: auto;}
.flex.tetra{display: flex;}
.flex.tetra .box{width: 47.5%;max-width: 295px;margin-right: 5%;}
.flex.tetra .box:nth-child(even){margin-right: 0;}
.flex.tetra.narrow .box{width: calc((100% - 5%) / 2);margin-bottom:5%;}
.sp-flex{display: flex !important;}
.sp-flex.sp-reverse{flex-direction: column-reverse;}
.sp-flex.di .box{width: 48.083333%;}
.sp-flex.di.narrow .box{width: calc((100% - 2px) / 2);margin-bottom:1px;}
.sp-flex.di.narrow01 .box{width: calc((100% - 10px) / 2);margin-bottom:10px;}
.sp-flex.tri .box{width: 32.083333%;margin-bottom:20px;}
.sp-flex.tri.narrow .box{width: calc((100% - 2px) / 3);margin-bottom:1px;}
.sp-flex.tetra .box{width: 24.083333%;}
.sp-flex.tetra .box:nth-child(even){margin-right: auto;}
.sp-flex.tetra.narrow .box{width: calc((100% - 3px) / 4);margin-bottom:1px;}
}
  section{overflow: hidden;margin-top: 100px;}
nav {
background-color: #fff;
width: 100%;
height: auto;
line-height: 1.5em;
box-shadow: none;
}
nav ul li {
float: none;
}
nav ul li a {
-webkit-transition: background-color .3s;
transition: background-color .3s;
font-size: 1rem;
color: inherit !important;
display: block;
padding: 0;
cursor: pointer;
}
nav ul li a:hover {
background-color: inherit;
}
#side .fmtBtn .soon,
.fmtBtn01 a{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 60px;
text-align: center;
}
.fmtBtn01 a{
background-color: #000;
padding-left: 1em;
}
.fmtBtn02 a{
display: flex;
justify-content: center;
align-items: center;
width: 160px;
height: 40px;
margin: 0 auto;
font-size: 14px;
line-height: 1.0;
text-align: center;
background-color: #828282;
}
.fmtBtn03 a{
display: flex;
justify-content: center;
align-items: center;
width: 160px;
height: 40px;
margin: 0 auto;
font-size: 14px;
line-height: 1.0;
text-align: center;
border: solid 1px #fff;
color: #fff;
padding-left: 30px;
position: relative;
}
.fmtBtn03 a::before{
content: '';
width: 20px;
min-height: 14px;
position: absolute;
left: 30px;
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/contact_icon.svg);
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: center left;
}
.secTitle-1{margin-bottom: 1.25em;font-size: 24px;line-height: 1.5;text-align: center;}
.secTitle-2{
margin-bottom: 55px;
font-size: 21px;
font-weight: bold;
line-height: 1.0;
color: #787878;
}
.secTitle-2 span{
position: relative;
display: block;
margin-bottom: 0.2em;
font-size: 60px;
font-weight: normal;
letter-spacing: 0;
}
.secTitle-2 span::before{
content: "";
position: absolute;
left: -50px;
top: calc(50% - 2px);
display: block;
width: 28px;
height: 3px;
background-color: #787878;
}
.secTitle-3{margin-bottom: 0.8em;font-size: 18px;}
.lead{font-size: 18px;line-height: 2.0;text-align: center;}
.bgSquare-1{position: relative;padding-bottom: 90px;}
.bgSquare-1>*{position: relative;z-index: 50;}
.bgSquare-1::before{
content: "";
position: absolute;
top: 90px;
z-index: 10;
width: 200%;
height: calc(100% - 90px);
background-color: #828282;
}
.bgSquare-1.rightCol::before{left: 80px;}
.bgSquare-1.leftCol::before{right: 80px;}
.bgSquare-2{position: relative;padding-bottom: 0px;}
.bgSquare-2>*{position: relative;z-index: 50;}
.bgSquare-2::before{
content: "";
position: absolute;
top: 200px;
z-index: 10;
width: 200%;
height: calc(100% - 220px - 100px);
background-color: #828282;
}
.bgSquare-2.rightCol::before{left: 80px;}
.bgSquare-2.leftCol::before{right: 80px;}
.titleList{border-bottom: solid 1px #FFF;}
.box.titleList{width: calc(100% - 400px);min-height: 312px;}
.box.titleList02{width: 100%;min-height: auto;margin-bottom: 100px;}
.titleList li{border-top: solid 1px #FFF;}
.box.titleList li{height: 33%;}
.box.titleList02 li{height: 6em;}
.box.titleList02 li.long{height: auto;}
.titleList dl{
display: flex;
height: 100%;
padding: 1em 0;
font-size: 14px;
letter-spacing: 0.05em;
justify-content: flex-start;
align-items: center;
}
.titleList dt{width: 11em;}
.box.titleList + .image{width: 360px;height: 320px;}
.box.titleList02 + .image{width: 100%;height: 320px;}
.box.titleList + .image iframe{width: 100%; height: 100%;;}
.row.leftText {display:flex;flex-flow: row-reverse;flex-wrap: wrap;}
.row.rightText {display:flex;flex-wrap: wrap;}
.vertical-rl {
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
letter-spacing: 0;
font-feature-settings: normal;
text-orientation: upright;
-webkit-text-orientation: upright;
}
.vertical-alpha { -webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
letter-spacing: 0;
font-feature-settings: normal;
text-orientation: sideways;
-webkit-text-orientation: sideways;
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
} @media screen and (max-width: 1119px) { .inner{max-width: 660px;}  .box.titleList{width: 100%;min-height: 0;}
.box.titleList li{height: auto;}
.box.titleList + .image{width: 360px;margin: 40px auto 0;}
}  @media screen and (max-width: 959px) {  .secTitle-2{margin-bottom: 34px;font-size: 18px;}
.secTitle-2 span{font-size: 36px;}
.secTitle-2 span::before{left: -24px;top: calc(50% - 1px);width: 12px;height: 2px;}
.secTitle-3{margin-bottom: 0.8em;font-size: 18px;}
.bgSquare + section{margin-top: 75px;}
.bgSquare-1{position: relative;padding-bottom: 40px;}
.bgSquare-1::before{
top: 40px;
height: calc(100% - 40px);
}
.bgSquare-1.rightCol::before{left: -5%;}
.bgSquare-1.leftCol::before{right: -5%;}
.bgSquare-2{position: relative;padding-bottom: 90px;}
.bgSquare-2::before{
top: 90px;
height: calc(100% - 90px);
}
.bgSquare-2.rightCol::before{left: -5%;}
.bgSquare-2.leftCol::before{right: -5%;}
.box.titleList{width: 100%;min-height: 0;}
.titleList{border-bottom: none;}
.titleList dl{
display: block;
height: auto;
padding: 2em 0;
font-size: 14px;
}
.titleList dt{width: 100%;margin-bottom: 0.3em;}
.box.titleList + .image{width: 100%;margin: 0 auto;}
.row.leftText {display:block;}
.row.rightText {display:block;}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) {}.head-1{
position: relative;
}
.head-1 .logo{
width: 80%;
max-width: 200px;
max-height: 200px;
margin: 0 auto;
display: inline-block;
transition: all 0.2s;
}
.head-1 .logo .small{
max-width: 40px;
max-height: 40px;
display: none;
transition: all 0.2s;
}
#globalNavi.bg-white .logo .big{
display: none;
transition: all 0.2s;
}
#globalNavi.bg-black .logo .big{
display: none;
transition: all 0.2s;
}
#globalNavi.bg-white .logo .small{
display: block;
transition: all 0.2s;
}
#globalNavi.bg-black .logo .small{
display: block;
transition: all 0.2s;
}
.head-1 .key{
position: relative;
min-height: 700px;
max-height: 70vh;
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/key01.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center right;
}
#top .head-1 .key {
height: 100vh;
min-height: 700px;
position: relative;
background-image: none;
min-height: auto;
max-height: 100vh;
}
.news .head-1 .key,
#faq .head-1 .key,
#contact .head-1 .key,
#sitemap .head-1 .key,
.single .head-1 .key {
min-height: auto;
height: 320px;
background: none !important;
margin-bottom: -175px;
}
.news .head-1 .key .pageTitle,
#faq .head-1 .key .pageTitle,
#contact .head-1 .key .pageTitle,
#sitemap .head-1 .key .pageTitle,
.single .head-1 .key .pageTitle {
color: #000;
}
.news .head-1 .key .pageTitle > *,
#faq .head-1 .key .pageTitle > *,
#contact .head-1 .key .pageTitle > *,
#sitemap .head-1 .key .pageTitle > *,
.single .head-1 .key .pageTitle > * {
filter: none;
}
.head-1 .key::before{
content: "";
display: block;
width: 0;
padding-top: 59.765625%;
}
#top .head-1 .key::before{
display: none;
}
#top .head-1 .key div.mv-swiper-container,
#top .head-1 .key div.swiper-wrapper,
#top .head-1 .key div.swiper-slide {
height: 100vh;
min-height: 700px;
}
#top .head-1 .key div.swiper-slide img {
height: 100vh;
min-height: 700px;
width: 100%;
object-fit: cover;
}
.head-1 .pageTitle{
position: absolute;
top: 270px;
right: 80px;
line-height: 1.0;
z-index: 99;
color: #fff;
}
#top .head-1 .pageTitle{
top: auto;
bottom: 10vh;
}
.head-1 .pageTitle .catch{
display: block;
font-size: 28px;
line-height: 1.75;
letter-spacing: 0.1em;
filter: drop-shadow(0px 0px 10px rgba(0,0,0,0.6));
}
.head-1 .pageTitle .s-title{
display: block;
margin-top: 0.4em;
font-size: 24px;
line-height: 1.75;
letter-spacing: 0.1em;
filter: drop-shadow(0px 0px 10px rgba(0,0,0,0.6));
}
.head-1 .pageTitle .title{
display: block;
font-size: 60px;
font-weight: normal;
letter-spacing: 0;
filter: drop-shadow(0px 0px 10px rgba(0,0,0,0.6));
}
.head-1 .pageTitle .title span{font-weight: 100;}
.head-1 .pageTitle + .catch{
position: absolute;
bottom: 80px;
right: 80px;
width: 3.75em;
font-size: 130px;
line-height: 0.9;
-webkit-transform: rotate(-11deg);
transform: rotate(-11deg);
filter: drop-shadow(0px 0px 10px rgba(0,0,0,0.6));
}
.head-1 .pageTitle + .catch span{display: block;}
.head-1 .pageTitle + .catch span + span{text-align: right;}
#globalNavi{
position: fixed;
top: 0;
left: 0;
z-index: 995;
width: 100%;
height: auto;
background-color: transparent;
color: #3C3C3C;
line-height: 1.6;
}
#globalNavi .inner{
position: relative;
width: 100%;
max-width: 100%;
height: 75px;
padding: 1.5rem 2rem;
}
#globalNavi .navTitle{font-size: 18px;font-weight: normal;margin-left: 0;margin-bottom: 40px;}
#globalNavi .navTitle span{font-weight: 100;}
#globalNavi .bottom{position: absolute;bottom: 30px;}
#globalNavi .inner nav{
background-color: transparent;
max-width: 610px;
margin-right: 200px;
height: 100%;
}
.navigation-container {height:100%;}
.navigation-container ul {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-pack: flex-start;
-webkit-justify-content: flex-start;
-ms-flex-pack: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
height: 100%;
}
.navigation-container ul li{
margin-left: 10px;
min-width: 90px;
}
.navigation-container ul li a{
position: relative;
text-align: center;
overflow: hidden;
padding: 5px 10px;
}
.navigation-container ul li a::after {
position: absolute;
bottom: 0;
left: 0;
display: block;
content: "";
width: 0%;
height: 1px;
background: #fff;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.navigation-container ul li a span {
display: block;
width: 100%;
margin: 0 auto;
transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.navigation-container ul li a span.jp {
position: absolute;
top: 100%;
left: 0%;
font-size: 14px;
font-weight: bold;
white-space: nowrap;
}
.navigation-container ul li a:hover::after {
width: 100%;
}
.navigation-container ul li a:hover span.en {
transform: translate(0%, -150%);
}
.navigation-container ul li a:hover span.jp {
top: 10%;
}
#globalNavi.bg-white .navigation-container ul li a{color: #000 !important;}
#globalNavi.bg-black .navigation-container ul li a{color: #fff !important;}
#globalNavi.bg-white .navigation-container ul li a::after{background-color: #000 !important;}
#globalNavi.bg-black .navigation-container ul li a::after{background-color: #fff !important;}
.navigation-container ul li a:hover{opacity: 1 !important;}
.sub-navigation-container {margin-bottom: 1em;}
.sub-navigation-container ul li span{font-size: 12px;}
.sub-navigation-container ul li span.en{display: block;}
.sub-navigation-container ul li span.jp{display: none;}
.sub-navigation-container ul li:hover span.en{display: none;}
.sub-navigation-container ul li:hover span.jp{display: block;}
.infoList dt{font-size: 18px;line-height: 1.0;}
.infoList dt h2{font-size: 18px;line-height: 1.0;font-weight:normal;}
.infoList dt span{display: block;margin-top: 0.5em;font-size: 10px;}
.infoList dd{margin-top: 1.5em;font-size: 10px;line-height: 1.8;}
.snsList{justify-content: flex-start;align-items: center;height: 100%;}
.snsList li{width: 20px;height: 20px;}
.snsList li + li{margin-left: 8px;}
.snsList li a{display: block;padding: 0;}
.snsList li a img{min-width: 20px;}
.copy{margin-top: 20px;font-size: 10px;font-weight: 100;}
#globalNavi .fmtBtn{
position: absolute;
top: 50%;
right: 140px;
transform: translate(0%, -50%);
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
width: 160px;
}
#globalNavi .fmtBtn a{
background-color: transparent;
padding-left: 1em;
border: solid 1px;
border-color: #fff;
border-radius: 10px;
color: #fff !important;
height: 40px;
font-size: 14px;
}
#globalNavi.bg-white .fmtBtn a{
border-color: #000;
color: #000 !important;
}
#globalNavi.bg-black .fmtBtn a{
border-color: #fff;
color: #fff !important;
}
#globalNavi .fmtBtn .soon{font-size: 10px;background-color: #828282;color: #fff;}
#globalNavi .fmtBtn .soon,
#globalNavi .fmtBtn01 a::before{
content: '';
width: 20px;
height: 15px;
position: absolute;
left: 30px;
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/contact_icon.svg);
background-size: 15px 15px;
background-repeat: no-repeat;
background-position: center left;
}
#globalNavi.bg-white .fmtBtn01 a::before{
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/contact_icon_bk.svg);
}
#globalNavi.bg-black .fmtBtn01 a::before{
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/contact_icon.svg);
}
#globalNavi.bg-transparent .wh{
display: block;
}
#globalNavi.bg-transparent .bk{
display: none;
}
#globalNavi.bg-white .wh{
display: none;
}
#globalNavi.bg-white .bk{
display: block;
}
#globalNavi.bg-black .wh{
display: block;
}
#globalNavi.bg-black .bk{
display: none;
}
.scroll-point{
position: absolute;
bottom: 33px;
left: calc(50% - 8px);
width: 16px;
height: 26px;
border: solid 1px #FFF;
border-radius: 8px;
z-index: 99;
}
.scroll-point div{
position: absolute;
top: 4px;
left: calc(50% - 3px);
width: 6px;
height: 6px;
background-color: #FFF;
border-radius: 100%;
animation-name: point-anime;
animation-duration: 1.5s;
animation-delay: 0.5s;
animation-iteration-count: infinite;
animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.25);
animation-direction: normal;
}
@keyframes point-anime{
0%{top: 4px;}
33%{top: 14px;}
70%{top: 14px;}
80%{top: 14px;opacity: 0;}
90%{top: 4px;opacity: 0;}
100%{top: 4px;opacity: 1;}
} @media screen and (max-height: 670px) {} @media screen and (max-width: 1150px) {
.head-1 .logo{
max-width: 120px;
max-height: 120px;
} .head-1 .pageTitle .catch{font-size: 22px;}
.head-1 .pageTitle .title{font-size: 45px;}
.head-1 .pageTitle + .catch{font-size: 90px;}
}  @media screen and (max-width: 1080px) {
#globalNavi .inner nav {
max-width: 520px;
margin-right: 190px;
}
.navigation-container ul li:last-child {
display: none;
}
}  @media screen and (max-width: 959px) { .type-head-1 main,
.type-head-1 #pageHeader{padding-left: 0;} .head-1{}
.head-1 .key{
min-height: 0;
max-height: none;
max-height: 667px;
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/key02.jpg);
background-size: cover;
background-position: center center;
}
#laundry .head-1 .key {
background-position: center right;
}
.sub .head-1 .key{
height: 300px;
}
#sweets .head-1 .key{
background-position: left center;
}
.news .head-1 .key,
#faq .head-1 .key,
#contact .head-1 .key,
#sitemap .head-1 .key,
.single .head-1 .key {
margin-bottom: -100px;
margin-top: -50px;
}
.head-1 .key::before{padding-top: 178%;}
.head-1 .pageTitle{
top: 36px;
right: auto;
left: 11%;
}
.head-1 .pageTitle .catch{font-size: 16px;}
.head-1 .pageTitle .title{font-size: 34px;}
.head-1 .pageTitle + .catch{
bottom: 30px;
right: auto;
left: 11%;
font-size: 65px;
}
#top .head-1 .key div.mv-swiper-container,
#top .head-1 .key div.swiper-wrapper,
#top .head-1 .key div.swiper-slide {
min-height: auto;
}
#top .head-1 .key div.swiper-slide img {
min-height: auto;
}
#globalNavi{display: none;}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) { .head-1 .pageTitle + .catch{font-size: 22vw;}
}  @media screen and (max-width: 320px) {
#sweets .head-1 .key{
background-position: -50px center;
}
}.foot-5-3{
padding: 40px 0;
}
#inner-footer {
position: relative;
margin: 0px auto;
}
#inner-footer nav {
color: #3C3C3C;
background-color: transparent;
}
.footer-nav{
}
.footer-nav ul{
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
}
.footer-nav ul li{
}
.foot-5-3 .footer_logo {
max-width: 70px;
margin-top: 10px;
}
.foot-5-3 .info_address {
}
.foot-5-3 .info_near_access {
margin-bottom: 1em;
}
.foot-5-3 .info_tel { }
.foot-5-3 .info_tel span {
margin-right: 5px;
}
.foot-5-3 .snsList {
margin-top: 10px;
margin-bottom: 15px;
justify-content: flex-end;
}
.foot-5-3 .snsList li {
width: 32px;
height: 32px;
}
.foot-5-3 .snsList li a img {
min-width: 30px;
}
.foot-5-3 .snsList li + li {
margin-left: 15px;
}
.foot-5-3 .copyright {
text-align: left;
margin-top: 35px;
}
#pageFooter.bg-white .navigation-container {
max-width: 500px;
margin-right: 0;
margin-left: auto;
}
#pageFooter.bg-white .navigation-container ul li a::after {
background-color: #000 !important;
}
#pageFooter .navigation-container ul li {
margin-left: 30px;
min-width: auto;
line-height: 2;
}
#pageFooter .navigation-container ul li:first-child {
margin-left: 0px;
}
#pageFooter .navigation-container ul li a {
position: relative;
text-align: right;
overflow: hidden;
padding: 5px 0px;
color: inherit !important;
}
#pageFooter .navigation-container ul li a span.jp {
text-align: center;
}
#pageFooter .navigation-container ul li a::after {
background: #000;
} @media screen and (max-width: 1279px) {}  @media screen and (max-width: 959px) { .foot-5-3{display: block;text-align: center;padding: 10px 0 100px;}
.foot-5-3 .inner{padding-bottom: 30px;}
.foot-5-3 .infoList dt{margin-bottom: 20px;}
.foot-5-3 .infoList dd{margin-top: 0;}
.foot-5-3 .snsList{display: flex;justify-content: center;}
.foot-5-3 .fmtBtn{position: relative;}
.foot-5-3 .fmtBtn .soon{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 60px;
font-size: 10px;
line-height: 1.0;
background-color: #828282;
}
.foot-5-3 .fmtBtn .totop{
position: absolute;
top: 0;
right: 0;
width: 60px;
height: 60px;
background-color: #000;
}
.foot-5-3 .fmtBtn .totop a{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.foot-5-3 .fmtBtn .totop img{width: 20px;height: 18px;}
#inner-footer {
margin: 0 auto;
}
}
 .secSidebar-1{
}
.secSidebar-1 nav{
background-color: inherit;
border-left: solid 1px;
padding-left: 30px;
margin-bottom: 2em;
min-height: 165px;
}
.secSidebar-1 nav + nav {
margin-top: 50px;
}
.secSidebar-1 nav .secTitle-2{
margin-bottom: 35px;
}
.secSidebar-1 nav .cat-item{
} .secSidebar-2 nav {
color: #000;
}
.secSidebar-2 nav + nav {
margin-top: 50px;
}
.secSidebar-2 nav ul li{
margin-bottom: 0.5em;
} @media screen and (max-width: 1119px) {}  @media screen and (max-width: 959px) {}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) {}
  .secFlow-1 {
padding-top: 140px;
padding-bottom: 100px;
}
.secFlow-1 .inner {
}
.secFlow-1 .inner .secTitle-2 {
}
.secFlow-1 .inner .secTitle-2 span {
}
.secFlow-1 .inner .flowList-1 {
}
.secFlow-1 .inner .flowList-1 li {
position: relative;
border: solid 1px #3C3C3C;
height: 80px;
margin-bottom: 40px;
}
.secFlow-1 .inner .flowList-1 li>* {
height: 100%;
}
.secFlow-1 .inner .flowList-1 li span.step {
font-size: 26px;
line-height: 1.5em;
color: #fff;
background-color: #3C3C3C;
padding-left: 1em;
padding: 10px;
padding-right: 15px;
text-align: right;
display: flex;
flex-direction: column;
justify-content: center;
}
.secFlow-1 .inner .flowList-1 li span.step:before {
content: 'step';
width: 4em;
font-size: 12px;
line-height: 3em;
letter-spacing: 0.075;
position: absolute;
left: -5px;
}
.secFlow-1 .inner .flowList-1 li h3.heading {
font-size: 24px;
line-height: 1.5em;
letter-spacing: 0.075;
padding: 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.secFlow-1 .inner .flowList-1 li h3.heading span {
}
.secFlow-1 .inner .flowList-1 li p.txt {
font-size: 14px;
line-height: 2em;
letter-spacing: 0.075;
padding: 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding-left: 80px;
position: relative;
}
.secFlow-1 .inner .flowList-1 li p.txt:before {
content: '';
width: 1px;
height: 60px;
border-left: solid 1px #3C3C3C;
position: absolute;
left: 0;
} .secService-1 {
}
.secService-1 .leftCol{
width: 90%;
margin-left: 10%;
padding-bottom: 100px;
}
.secService-1 .leftCol:before{
right: 5%;
height: calc(100% - 200px);
}
.secService-1 .rightCol{
width: 90%;
margin-right: 10%;
padding-bottom: 100px;
}
.secService-1 .rightCol:before{
left: 5%;
height: calc(100% - 200px);
} .secSidebar-1{
}
.secSidebar-1 nav{
background-color: inherit;
border-left: solid 1px;
padding-left: 30px;
margin-bottom: 2em;
min-height: 165px;
}
.secSidebar-1 nav .secTitle-2{
font-size: 16px;
margin-bottom: 35px;
letter-spacing: 0.1;
}
.secSidebar-1 nav .cat-item{
font-size: 12px;
letter-spacing: 0.1;
} .secNextList {
overflow: visible;    
}
.secNextList .inner {
}
.secNextList .inner .btn {
}
.secNextList .inner .back {
}
.secNextList .inner .prev,
.secNextList .inner .next {
text-align:right;
}
.secNextList .inner .prev a,
.secNextList .inner .next a{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
vertical-align: middle;
text-decoration: none;
font-size: 15px;
color:#fff;
}
.secNextList .inner .prev a{
padding-left:90px;    
}
.secNextList .inner .next a{
padding-right:90px;    
}
.secNextList .inner .prev a::before,
.secNextList .inner .prev a::after,
.secNextList .inner .next a::before,
.secNextList .inner .next a::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.secNextList .inner .prev a::before,
.secNextList .inner .next a::before{
top: 0px;
width: 70px;
height: 1px;
background: #fff;
}
.secNextList .inner .prev a::before{
left: 0;
}
.secNextList .inner .next a::before{
right: -90px;
}
.secNextList .inner .prev a::after,
.secNextList .inner .next a::after{
width: 7px;
height: 7px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
}
.secNextList .inner .prev a::after{
left: 1px;
-webkit-transform: rotate(225deg);
transform: rotate(225deg);    
}
.secNextList .inner .next a::after{
right: -153px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
@-webkit-keyframes sdb_prev {
0% {
width: 0;
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -70px;
opacity: 0;
}
}
@keyframes sdb_prev {
0% {
width: 0;
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -70px;
opacity: 0;
}
}
@-webkit-keyframes sdb_next {
0% {
width: 0;
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -70px;
opacity: 0;
}
}
@keyframes sdb_next {
0% {
width: 0;
right: 0;
opacity: 0;
}
50% {
opacity: 1;
}
100% {
width: 70px;
right: -70px;
opacity: 0;
}
} .secContact {
}
.secContact .inner{
}
.secContact .box01 {
}
.secContact .message {
}
.secContact .message p {
text-align: center;
font-size: 14px;
letter-spacing: 0.075;
line-height: 1.7;
}
.secContact .tel {
margin-top: 30px;
text-align: center;
}
.secContact .tel a {
font-size: 24px;
letter-spacing: 0.075;
line-height: 1.3;    
}
.secContact .tel p {
font-size: 12px;
letter-spacing: 0.075;
line-height: 1.5;
text-align: center;
}
.secContact .download,
.secContact .submit {
text-align: center;
display: block;
margin: 40px auto 100px;
width: 320px;
height: 50px;
}
.secContact .download:hover,
.secContact .submit:hover{
background-color: #828282;
}
.secContact .download a,
.secContact .submit a {
width: 100%;
height: 100%;
display: block;
line-height: 50px;
}
.secContact .your-zipcode1 {
max-width: 80px;
display: inline-block;
}
.secContact .your-zipcode2 {
max-width: 80px;
display: inline-block;
}
.secContact .search {
margin: 0 1.5em 0.25em;
}
.secContact .search:hover {
background-color: #828282;
}
.secContact div.contactForm {
margin-top: 100px;
}
.secContact div.contactForm dl {
display: flex;
font-size: 14px;
margin-bottom: 2em;
justify-content: space-between;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.secContact div.contactForm dt {
width: 30%;
}
.secContact div.contactForm dt span {
}
.secContact div.contactForm dt span::before {
content: '-';
margin-left: 0.5em;
}
.secContact div.contactForm dd {
width: 70%;
}
.secContact div.contactForm dd span input,
.secContact div.contactForm dd span textarea,
.secContact div.contactForm dd span select{
background-color: #fff;
display: block;
}
.secContact div.contactForm dd span textarea{
padding: 1em;
display: block;
box-sizing: border-box;
margin: 0;
}
.secContact div.contactForm dd span select{
border-radius: 0px !important;
-webkit-appearance: none;
}
.secContact div.contactForm dl#privacy {
align-items: flex-start;
}
.secContact div.contactForm dl#privacy dt {
margin-top: 1em;
}
.secContact div.contactForm dl#privacy dd div.pp {
font-size: 12px;
height: 12em;
overflow-y: scroll;
padding: 1em;
margin-bottom: 1.5em;
}
.secContact div.contactForm dl#privacy dd div.pp p,
.secContact div.contactForm dl#privacy dd div.pp ul{
letter-spacing: 0.060;
line-height: 1.75;
margin-bottom: 1.5em;
}
.secContact div.contactForm dl#privacy dd p label {
color: #fff;
} .secSitemap {
max-width: inherit;
}
.secSitemap .inner {
}
.secSitemap .inner ul.sitemapList {
text-align: center;
padding: 0 1em;
}
.secSitemap .inner ul.sitemapList li {
font-size: 16px;
border-bottom: solid 1px;
border-color: #fff;
}
.secSitemap .inner ul.sitemapList li:first-child {
border-top: solid 1px;
border-color: #fff;
}
.secSitemap .inner ul.sitemapList li a {
width: 100%;
height: 100%;
padding: 2em 0;
display: block;
}
#pageSitemap-2.secSitemap .inner ul.sitemapList li {
width: 48%;
font-size: 16px;
border-bottom: solid 1px;
}
#pageSitemap-2.secSitemap .inner ul.sitemapList li:nth-child(1),
#pageSitemap-2.secSitemap .inner ul.sitemapList li:nth-child(2){
border-top: solid 1px;
}
#pageSitemap-2.secSitemap .inner ul.sitemapList li:nth-child(odd) {
margin-right: 2%;
}
#pageSitemap-2.secSitemap .inner ul.sitemapList li:nth-child(even) {
margin-left: 2%;
} .secA-1 .secTitle-1{
font-size: 28px;
font-weight: bold;
margin-bottom: 0.75em;
letter-spacing: 0.15em;
}
.secA-1 .secTitle-1-1{
font-size: 40px;
font-weight: 500;
margin-bottom: 0.7em;
letter-spacing: 0.075em;
text-align: center;
}
.secA-1 .lead{
font-size: 14px;
letter-spacing: 0.12em;
line-height: 2em;
} .secB-1{}
.secB-1 figure{width: 67%;}
.secB-1 .box{width: 28%;}
.secB-1 .secTitle-2{
font-size:22px;
line-height: 1.5;
letter-spacing: 0.15em;
margin-bottom: 1.25em;
}
.secB-1 .secTitle-2 + .txt{
line-height: 2;
letter-spacing: 0.12em;
margin-bottom: 60px;
}
.secB-1 .secTitle-3{
line-height: 1.5;
margin-bottom: 1.5em;
}
.secB-1 .secTitle-3 + .txt{
line-height: 2;
margin-bottom: 50px;
}
.secB-1 .secTitle-3 + .txt:last-child{
margin-bottom: 0;
}
.secB-1.responsive div.inner{
min-height: 500px;
}
.secB-1.responsive figure{
width: auto;
min-height: 500px;
position: absolute;
top: 0;
right: 0;
}
.secB-1.responsive figure::before {
content: "";
display: block;
width: 0;
padding-top: 56.25%;
}
.secB-1.responsive figure>img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.secB-1.responsive .box{
width: 320px;
height: 100%;
padding-right: 50px;
text-align: left;
}
.secB-1.responsive .box .wrap{
width: 100%;
} .secB-2{}
.secB-2 figure{width: 67%;float:right;}
.secB-2 .box{width: 28%;float:left;}
.secB-2 .secTitle-2{
line-height: 1.5;
margin-bottom: 1.5em;
}
.secB-2 .secTitle-2 + .txt{
line-height: 2;
margin-bottom: 50px;
}
.secB-2 .secTitle-3{
line-height: 1.5;
margin-bottom: 1.5em;
}
.secB-2 .secTitle-3 + .txt{
line-height: 2;
margin-bottom: 50px;
}
.secB-2 .secTitle-3 + .txt:last-child{
margin-bottom: 0;
}
.secB-2.responsive div.inner{
min-height: 500px;
}
.secB-2.responsive figure{
width: auto;
min-height: 500px;
float:right;
position: absolute;
top: 0;
left: 0;
}
.secB-2.responsive figure::before {
content: "";
display: block;
width: 0;
padding-top: 56.25%;
}
.secB-2.responsive figure>img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.secB-2.responsive .box{
width: 320px;
height: 100%;
padding-left: 50px;
text-align: left;
float: right;
}
.secB-2.responsive .box .wrap{
width: 100%;
} .bgSquare + section.secB-6{margin-top: 60px;}
.secB-6 .secTitle-1{margin-bottom: 80px;} .secB-8{
padding: 50px;
margin-top: 80px;
}
.secB-8_2{
margin-top: 80px;
padding: 0;
overflow-y: hidden;
}
.leftCol .secB-8{
padding-right: 5%;
margin-right: 5%;
}
.rightCol .secB-8{
padding-left: 5.5%;
margin-left: 5.5%;
}
.secB-8 + .secB-8{margin-top: 10px;}
.secB-8 .bgSquare-2::before{
height: calc(100% - 200px);
}
.secB-8 .secTitle-3{
font-size: 24px;
line-height: 1em;
letter-spacing: 0.075;
}
.secB-8 .secTitle-4{
font-size: 20px;
line-height: 1em;
letter-spacing: 0.075;    
}
.secB-8 .txt{
font-size: 14px;
line-height: 2em;
letter-spacing: 0.075;    
max-width: 460px;
text-align: justify;
}
.secB-8_2 .secTitle-3{
font-size: 40px;
}
.secB-8_2 .secTitle-4{
font-size: 24px;
}
.secB-8_2 .txt{
font-size: 18px;
max-width: 100%;
}
.secB-8_2 .txt + h4 {
margin-top: 80px;
}
.secB-8 .titleList{
width: calc(100% - 450px);
min-height: 290px;
}
.secB-8 .titleList + .image {
width: 400px;
height: 320px;
}
.secB-8 .flex{margin-top: 30px;justify-content: space-evenly;}
.secB-8 .flex .tri {width: 33%;} .secB-9{margin-top: 54px;background-color: #fff;color: #3C3C3C;}
.secB-9 + .secB-9{margin-top: 10px;}
.secB-9 .heading{font-size: 24px;letter-spacing: 0.075;line-height: 1.5em;text-align: center;}
.secB-9 .titleList{min-height: 290px;}
.secB-9 .txt{max-width: 360px;}
.secB-9 .flex{margin-top: 30px;} .secC-4 .itemList-1 .box{
padding: 40px 20px;
text-align: center;
background-color: #fff;
color: #3C3C3C;
margin-bottom: 1em;
}
.secC-4 .itemList-1 .heading{
font-size: 24px;
line-height: 1.5;
width: 100%;
padding: 0;
}
.secC-4 .itemList-1 .heading span {display:block;}
.secC-4 .itemList-1 .heading span.jp {font-size: 24px;letter-spacing: 0.075;}
.secC-4 .itemList-1 .heading span.en {font-size: 14px;letter-spacing: 1;}
.secC-4 .itemList-1 .heading .img{
display: block;
max-width: 167px;
margin: 0 auto 36px;
}
.secC-4 .itemList-1 .txt{
margin-top: 30px;
font-size: 14px;
line-height: 2.0;
text-align: center;
} .secC-5 .itemList-1 .box{
padding: 40px 20px;
text-align: center;
background-color: #fff;
color: #3C3C3C;
margin-bottom: 1em;
}
.secC-5 .itemList-1 .heading{
font-size: 24px;
line-height: 1.5;
width: 300px;
padding: 0 50px 0 40px;
border-right: solid 1px #000;
box-sizing: border-box;
}
.secC-5 .itemList-1 .heading span {display:block;}
.secC-5 .itemList-1 .heading span.jp {font-size: 24px;letter-spacing: 0.075;}
.secC-5 .itemList-1 .heading span.en {font-size: 14px;letter-spacing: 1;}
.secC-5 .itemList-1 .heading .img{
display: block;
max-height: 90px;
margin: 0 auto 36px;
}
.secC-5 .itemList-1 .discription{
text-align: left;
width: calc(100% - 300px);
padding: 15px 0 0 80px;
}
.secC-5 .itemList-1 .discription h4{
font-size: 24px;
line-height: 1.5em;
letter-spacing: 0.075;
}
.secC-5 .itemList-1 .discription p{
margin-top: 30px;
font-size: 14px;
line-height: 2.0;
} .secE-2{
position: relative;
}
.secE-2 .itemList-1 .box{
padding: 0 0 0 30px;
text-align: center;
color: #fff;
}
.secE-2 .itemList-1 .box > div.image{
margin-bottom: 10px;
height: 240px;
}
.secE-2 .itemList-1 .box > div.image img{
width: 100%;
height: 100%;
object-fit: cover;
}
.secE-2 .itemList-1 .box > div.noImage img{
min-height: 150px;
}
.secE-2 .itemList-1 .category{font-size: 10px;line-height: 1.75;background: #3C3C3C;padding: 5px 10px;display: table;}
.secE-2 .itemList-1 .heading{font-size: 24px;line-height: 1.5;text-align: left;}
.secE-2 .itemList-1 .date{position: absolute;top: 0;left: 0;}
.secE-2 .itemList-1 .txt{margin-top: 10px;font-size: 12px;line-height: 2.0;text-align: left;} .secE-3{
overflow: inherit;
position: relative;
}
.secE-3 .itemList-1{
padding-bottom: 30px;
}
.secE-3 .itemList-1 .box{
padding: 40px;
margin-bottom: 10px;
text-align: center;
justify-content: flex-start;
}
.secE-3 .itemList-1 .box .image{
max-width: 160px;
height: 160px;
margin-right: 40px;
}
.secE-3 .itemList-1.flex.di .box .image {
margin-right: 0;
margin-bottom: 20px;
}
.secE-3 .itemList-1.flex.di .box .noImage img {
max-width: 100px;
}
.secE-3 .itemList-1 .box .noImage{
background-color: #fff;
padding: 50px;
}
.secE-3 .itemList-1 .box .text{
width: calc(100% - 200px);
text-align: left;
}
.secE-3 .itemList-1 .category{
min-width: 120px;
text-align: center;
display: inline-block;
font-size: 10px;
line-height: 1.75;
background: #3C3C3C;
padding: 5px 10px;
}
.secE-3 .itemList-1 .date{
font-size: 14px;
margin-left: 10px;
display: inline-block;
}
.secE-3 .itemList-1 .heading{font-size: 18px;line-height: 1.5;text-align: left;margin-top: 0.5em;}
.secE-3 .itemList-1 .txt{margin: 10px 0;font-size: 12px;line-height: 2.0;text-align: left;display: block;} .secE-4{
overflow: inherit;
position: relative;
}
.secE-4 .secTitle-2 {
margin-bottom: 20px;
}
.secE-4 .secTitle-2 + p {
text-align: center;
margin-bottom: 60px;
}
.secE-4 .itemList-1{
padding-bottom: 30px;
}
.secE-4 .itemList-1 .box{
padding: 0 20px;
margin-bottom: 30px;
text-align: center;
justify-content: flex-start;
}
.secE-4 .itemList-1 .box .image{
max-width: 100px;
height: auto;
margin-right: 20px;
}
.secE-4 .itemList-1 .box .noImage{
background-color: #fff;
padding: 50px;
}
.secE-4 .itemList-1 .box .text{
width: calc(100% - 120px);
text-align: left;
}
.secE-4 .itemList-1 .box .secTitle-3 {
letter-spacing: 0.035em;
line-height: 1;
margin-bottom: 1em;
}
.secE-4 .itemList-1 .box .secTitle-3 > span{
display: block;
font-size: 14px;
letter-spacing: 0.12em;
line-height: 1;
margin-top: 0.5em;
}
.secE-4 .itemList-1 .category{
min-width: 120px;
text-align: center;
display: inline-block;
font-size: 10px;
line-height: 1.75;
background: #3C3C3C;
padding: 5px 10px;
}
.secE-4 .itemList-1 .date{
font-size: 14px;
margin-left: 10px;
display: inline-block;
}
.secE-4 .itemList-1 .heading{font-size: 18px;line-height: 1.5;text-align: left;margin-top: 0.5em;}
.secE-4 .itemList-1 .txt{margin: 10px 0;font-size: 12px;line-height: 2.0;text-align: left;display: block;} .secG-1{
margin-bottom: 25px;
} .secG-2{
position: relative;
}
.secG-2 .bgSquare-1>img {
width: 90%;
margin-left: 10%;
}
.secG-2 .inner {
width: 90%;
margin-left: 10%;
margin-top: 40px;
}
.secG-2 .secTitle-3{font-size: 40px;line-height: 1.5;text-align: left;margin-bottom: 0.5em;}
.secG-2 .lead{font-size: 18px;letter-spacing:0.75;line-height: 2;text-align: left;} .secG-3{
position: relative;
overflow: visible;
}
.secG-3 .inner {
border: solid 1px;
padding: 60px;
}
.secG-3 .secTitle-5 {
font-size: 18px;
background-color: #fff;
width: auto;
padding: 1em;
text-align: center;
position: absolute;
top: -1.75em;
left: 50%;
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
}
.secG-3 .itemList-1 {
}
.secG-3 .itemList-1 .box {
width: calc( (100% - 50px) / 2 );
}
.secG-3 .itemList-1.mono .box {
width: 100%;
}
.secG-3 .itemList-1.di .box {
width: calc( (100% - 50px) / 2 );
}
.secG-3 .itemList-1 .box .image,
.secG-3 .itemList-1 .box .brand_logo {
margin-bottom: 50px;
}
.secG-3 .itemList-1.mono .box .image{
margin-bottom: 0px;
}
.secG-3 .itemList-1 .box .txt {
margin-bottom: 35px;
}
.secG-3 .itemList-2 {
margin-bottom: 50px;
}
.secG-3 .itemList-2 .image {
max-width: 400px;
}
.secG-3 .itemList-2 .box {
max-width: calc(100% - 485px);
margin-left: 85px;
}
.secG-3 .itemList-2 .btn {
margin-bottom: 0px;
}
.secG-3 .row .col.gap:first-child .overtext {
left: 1rem;
}
.secG-3 .row .col.gap:last-child .overtext {
left: 2rem;
}
.secG-3 .overtext span {
font-size: 16px;
}
.secG-3 .link-box .txt {
font-size: 11px;
line-height: 1.5;
letter-spacing: 0.03em;
margin-bottom: 1em;
}
.secG-3 .link-box .btn {
margin-bottom: 0;
} .secG-4{
position: relative;
overflow: visible;
}
.secG-4 .inner {
border: solid 1px;
padding: 60px;
}
.secG-4 .inner:before {
content: "ランドリーグッズ／雑貨";
font-size: 18px;
background-color: #fff;
width: 13em;
padding: 1em;
text-align: center;
position: absolute;
top: -1.75em;
left: 50%;
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
}
.secG-4 .overtext {
position: absolute;
bottom: 0;
left: 1.5rem;
font-size: 14px;
line-height: 1;
letter-spacing: 0.03em;
}
.secG-4 .row .col.gap:nth-child(2n-1) {
border-right: solid 1px #000;
} @media screen and (max-width: 1279px) {
}  @media screen and (max-width: 1119px) { .secC-4 .itemList-1 .heading{font-size: 20px;}
.secC-4 .itemList-1 .heading .img{max-width: 120px;}
.secC-4 .itemList-1 .txt{font-size: 10px;} .secE-2 .itemList-1 .heading{font-size: 20px;}
.secE-2 .itemList-1 .heading .img{max-width: 120px;}
.secE-2 .itemList-1 .txt{font-size: 10px;} .secE-3 .itemList-1 .heading{font-size: 20px;}
.secE-3 .itemList-1 .heading .img{max-width: 120px;}
.secE-3 .itemList-1 .txt{font-size: 10px;} .secE-4 .itemList-1 .heading{font-size: 20px;}
.secE-4 .itemList-1 .heading .img{max-width: 120px;}
.secE-4 .itemList-1 .txt{font-size: 10px;} .secG-2 .secTitle-3{font-size: 20px;}
.secG-2 .lead{font-size: 10px;}
}  @media screen and (max-width: 959px) { .secNextList .inner .back {
top: 50px;
}
.secNextList .inner .prev,
.secNextList .inner .next {
}
.secNextList .inner .prev + .next {
margin-left: 2em;
} .secContact div.contactForm dt,
.secContact div.contactForm dd{
width: 100%;
}
.secContact .search {
margin: 0.5em 0 0.25em;
display: block;
width: 150px;
} .secA-1 .lead{
font-size: 14px;
} .secB-1 figure{width: 100%;}
.secB-1 .box{width: 100%;margin-top: 1em;}
.secB-1 .secTitle-3 {
margin-bottom: 0.75em;
}
.secB-1.responsive div.inner{
width: 100%;
max-width: 100%;
min-height: auto;
}
.secB-1.responsive figure{
min-height: auto;
position: static;
padding-left: 8%;
margin-bottom: 1em;
}
.secB-1.responsive figure::before {
display: none;
}
.secB-1.responsive figure>img {
position: static;
}
.secB-1.responsive .box{
display: block;
width: 84%;
height: auto;
padding-right: 0;
margin: 25px auto 0;
}
.secB-1 .secTitle-2 + .txt {
margin-bottom: 30px;
} .secB-2 figure{width: 100%;}
.secB-2 .box{width: 100%;margin-top: 1em;}
.secB-2 .secTitle-3 {
margin-bottom: 0.75em;
}
.secB-2 .secTitle-2 + .txt {
margin-bottom: 30px;
}
.secB-2.responsive div.inner{
width: 100%;
max-width: 100%;
min-height: auto;
}
.secB-2.responsive figure{
min-height: auto;
position: static;
padding-right: 8%;
margin-bottom: 1em;
float: none;
}
.secB-2.responsive figure::before {
display: none;
}
.secB-2.responsive figure>img {
position: static;
}
.secB-2.responsive .box{
display: block;
width: 84%;
height: auto;
float: none;
padding-left: 0;
margin: 25px auto 0;
} .bgSquare + section.secB-6{margin-top: 30px;}
.secB-6 .secTitle-1{margin-bottom: 30px;} .secB-8{padding: 18px 18px 29px;margin-top: 33px;}
.secB-8 .titleList{min-height: 0;} .secB-9{padding: 18px 18px 29px;margin-top: 33px;}
.secB-9 .titleList{min-height: 0;} .secC-4 .itemList-1 .heading{font-size: 24px;}
.secC-4 .itemList-1 .heading .img{max-width: 167px;}
.secC-4 .itemList-1 .txt{font-size: 12px;}
.secC-4 .itemList-1 li + li{margin-top: 10px;} .secE-2 .itemList-1 .heading{font-size: 24px;}
.secE-2 .itemList-1 .heading .img{max-width: 167px;}
.secE-2 .itemList-1 .txt{font-size: 12px;}
.secE-2 .itemList-1 li + li{margin-top: 10px;} .secE-3 .itemList-1 .heading{font-size: 24px;}
.secE-3 .itemList-1 .heading .img{max-width: 167px;}
.secE-3 .itemList-1 .txt{font-size: 12px;}
.secE-3 .itemList-1 li + li{margin-top: 10px;}
.secE-3 .itemList-1{
padding-bottom: 20px;
}
.secE-3 .itemList-1 .box{
padding: 30px;
}
.secE-3 .itemList-1 .box .noImage{
margin-right: 0;
max-width: 100%;
}
.secE-3 .itemList-1 .box .text{
width: 100%;
}
.secE-3 .itemList-1 .category{
margin-top: 40px;
}
.secE-3 .itemList-1.di .category{
margin-top: 0px;
}
.secE-3 .itemList-1 .heading{
font-size: 21px;
}
.secE-3 .itemList-1 .txt{
font-size: 14px;
line-height: 1.75em;
text-align: justify;
margin-bottom: 30px;
}
.secE-3 .itemList-1 .box .image{
max-width: 100%;
height: auto;
margin-right: 0;
} .secE-4 .itemList-1 .box .image{
max-width: 100px;
height: auto;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
}
.secE-4 .itemList-1 .box .text{
width: 100%;
}
.secE-4 .itemList-1 .box .secTitle-3 {
margin-bottom: 25px;
}  .secG-2 .secTitle-3{font-size: 24px;}
.secG-2 .lead{font-size: 12px;} .secG-3 .inner {
padding: 10% 5%;
}
.secG-3 .secTitle-5 {
font-size: 16px;
min-width: 250px;
}
.secG-3 .itemList-1 {
}
.secG-3 .itemList-1 .box {
width: 100%;
}
.secG-3 .itemList-1 .box + .box {
margin-top: 50px;
}
.secG-3 .itemList-1 .box .image,
.secG-3 .itemList-1 .box .brand_logo {
margin-bottom: 25px;
}
.secG-3 .itemList-1 .box .txt {
margin-bottom: 15px;
}
.secG-3 .itemList-2 {
margin-bottom: 25px;
}
.secG-3 .itemList-2 .image {
}
.secG-3 .itemList-2 .box {
max-width: 100%;
margin-left: 0px;
}
.secG-3 .itemList-2 .btn {
}
.secG-3 .row {
margin-bottom: 10px;
}
.secG-3 .row .col.gap .overtext,
.secG-3 .row .col.gap:first-child .overtext,
.secG-3 .row .col.gap:last-child .overtext {
left: 1rem;
} .secG-4 .row .col.gap:nth-child(2n-1) {
border-right: none;
border-bottom: solid 1px #000;
}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 600px) { .secSitemap .inner ul.sitemapList:last-child li:first-child {
border-top: none;
}
}  @media screen and (max-width: 479px) {}  @media screen and (max-width: 1199px) {}  @media screen and (max-width: 959px) {}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) {}.secNews-2{
position: relative;
}
.secNews-2 .itemList-1 .box{
max-width: 200px;
padding: 0;
}
.secNews-2 .itemList-1 .box > div.image{
max-width: 170px;
max-height: 170px;
margin: 20px auto;
}
.secNews-2 .itemList-1 .box > div.image img{
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 100%;
}
.secNews-2 .itemList-1 .box > div.noImage{
height: 170px;
}
.secNews-2 .itemList-1 .box > div.noImage img{
min-height: 100px;
}
.secNews-2 .itemList-1 .category{font-size: 10px;line-height: 1.75;background: #3C3C3C;padding: 5px 10px;display: table;}
.secNews-2 .itemList-1 .heading{font-size: 15px;line-height: 1.5;text-align: left;}
.secNews-2 .itemList-1 .date{font-size: 12px;}
.secNews-2 .itemList-1 .txt{margin-top: 10px;font-size: 14px;line-height: 2.0;text-align: left;} @media screen and (max-width: 1279px) {
}  @media screen and (max-width: 1119px) { .secNews-2 .itemList-1 .heading{font-size: 20px;}
.secNews-2 .itemList-1 .heading .img{max-width: 120px;}
.secNews-2 .itemList-1 .txt{font-size: 10px;}
}  @media screen and (max-width: 959px) { .secNews-2 .itemList-1 .heading{font-size: 24px;}
.secNews-2 .itemList-1 .heading .img{max-width: 167px;}
.secNews-2 .itemList-1 .box {
padding: 0;
margin-bottom: 30px;
}
.secNews-2 .itemList-1 .txt{font-size: 12px;}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 600px) {}  @media screen and (max-width: 479px) {}

.secInsta-1 header {
width: auto;
margin: 0 auto;
margin-bottom: 40px;
}
.secInsta-1 header h4 {
color: #b4b4b4;
text-align: center;
font-size: 19px;
}
.secInsta-1 header a {
margin: auto;
display: block;
}
.secInsta-1 header a img {
width: 100%;
max-width: 35px;
height: auto;
margin: 0 auto;
margin-bottom: 1em;
}
.secInsta-1 .box {
width: 100%;
}
.secInsta-1 .box a {
width: 180px;
height: 180px;
}
.secInsta-1 .box a:nth-of-type(n+6) {
margin-top: 30px;
}
.secInsta-1 .box a img {
width: 100%;
height: 100%;
object-fit: cover;
} @media screen and (max-width: 1119px) {}  @media screen and (max-width: 959px) {
.secInsta-1 {
padding: 0;
}
.secInsta-1 .inner {
align-items: flex-start;
}
.secInsta-1 header {
width: 100%;
position: relative;
margin-bottom: 20px;
}
.secInsta-1 header h4 {
text-align: center;
padding-left: 0;
margin-bottom: 0;
padding: 0 0 10px;
font-size: 20px;
}
.secInsta-1 header a {
}
.secInsta-1 header a img {
width: 100%;
height: auto;
}
.secInsta-1 .box {
width: 100%;
display: flex;
}
.secInsta-1 .box a {
width: 33%;
height: 33vw;
display: block;
}
.secInsta-1 .box a:nth-of-type(n+4) {
margin-top: .5%;
}
.secInsta-1 .box a:nth-of-type(10) {
display: none;
}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) {}

.single .secColumn-1 {
max-width: 600px;
}
.single .secColumn-1 > *{
font-weight: normal !important;
line-height: 1.75 !important;
letter-spacing: 0.05em !important;
}
.single .secColumn-1 h1 {
font-size: 21px !important;
margin-top: 10px;
margin-bottom: 45px;
}
.single .secColumn-1 h2 {
font-size: 18px !important;
line-height: 1;
margin-top: 40px;
margin-bottom: 30px;
padding-bottom: 10px;
border-bottom: solid 1px;
counter-increment: h2;
counter-reset: h3 h4 h5 h6;
}
.single .secColumn-1 h3 {
font-size: 16px !important;
font-weight: normal;
margin-top: 25px;
margin-bottom: 25px;
counter-increment: h3;
counter-reset: h4 h5 h6;
}
.single .secColumn-1 h2::before,
.single .secColumn-1 h3::before {
color: #aab8c2;
font-family: Arial;
font-size: 0.75rem;
font-weight: normal;
margin-top: 5px;
position: absolute;
right: 0;
white-space: pre;
}
.single .secColumn-1 h2::before { }
.single .secColumn-1 h3::before { }
.single .secColumn-1 h4 {
font-size: 14px !important;
line-height: 1.75 !important;
margin-bottom: 0.25em !important;
}
.single .secColumn-1 h4.doton:before {
content: '・ ';
}
.single .secColumn-1 h4 + .txt {
margin-left: 0.75em;
}
.single .secColumn-1 .txt ul {
counter-reset:list;
list-style-type:none;
padding:0;
margin: 0 0 1.75em;
}
.single .secColumn-1 .txt ul li {
position:relative;
padding: 0 0 0 20px;
margin: 7px 0 7px 0px;
font-weight: bold;
line-height: 30px;
}
.single .secColumn-1 .txt ul li:before{
counter-increment: list;
content: "";
display: block;
position: absolute;
left: 5px;
height: 5px;
width: 5px;
border-radius: 50%;
background: #646464;
top: 1em;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.single .secColumn-1 .txt ol {
counter-reset:list;
list-style-type:none;
padding: 0;
}
.single .secColumn-1 .txt ol li {
position:relative;
line-height: 30px;
margin: 7px 0 10px 40px;
padding-left:10px;
font-weight: bold;
border-bottom:solid 1px #646464;
}
.single .secColumn-1 .txt ol li:before{
counter-increment: list;
content: counter(list);
position: absolute;
left: -30px;
width: 30px;
height: 32px;
background: #646464;
text-align: center;
color: #fff;
top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.single .secColumn-1 .column-box {
border: solid 1px #646464;
background-color: #f5f5f5;
padding: 5% 10%;
margin-bottom: 1.75em;
}
.single .secColumn-1 .column-box > p,
.single .secColumn-1 .column-box > ul,
.single .secColumn-1 .column-box > ol{
margin-bottom: 0;
}
.single .secColumn-1 .column-box2 {
background-color: #f5f5f5;
border: none;
}
.single .secColumn-1 .txt p {
letter-spacing: 0.05em;
line-height: 1.75;
margin-bottom: 1.75em;
}
.single .secColumn-1 .txt p span.s1 {
}
.single .secColumn-1 .txt p span.s2 {
letter-spacing: 0.05em;
}
.single .secColumn-1 .txt p br{
line-height: initial;
}
.single .secColumn-1 .txt1,
.single .secColumn-1 .txt2,
.single .secColumn-1 .txt3,
.single .secColumn-1 .txt5 {
margin-bottom: 0px;
}
.single .secColumn-1 .txt4 p {
margin-bottom: 0.75em;
} .secColumn-1 .txt {
margin-bottom: 10px;
display: inline-block;
}
.secColumn-1 .txt p {
}
.secColumn-1 .category {
min-width: 100px;
text-align: center;
display: inline-block;
font-size: 10px;
line-height: 1;
background: #3C3C3C;
color: #fff;
padding: 5px 10px;
}
.secColumn-1 .date {
margin-left: 10px;
display: inline-block;
} .double-line {
position: relative;
text-align: center;
border: 0 none;
background-color: transparent;
margin-bottom: 1em;
}
.double-line>span {
position: relative;
z-index: 2;
background-color: #fff;
padding: 1rem;
border: 0 none;
}
.double-line:before {
display: block;
color: transparent;
content: ".";
border-top: 1px solid #646464;
position: absolute;
top: 40%;
width: 100%;
}
.double-line:after {
display: block;
color: transparent;
content: ".";
border-top: 1px solid #646464;
position: absolute;
top: 60%;
width: 100%;
} .double-line2 {
border-top: 1px solid #646464;
border-bottom: 1px solid #646464;
text-align: center;
padding: .5rem;
} @media screen and (max-width: 1119px) {}  @media screen and (max-width: 959px) {}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) {}.secGallery-1 #main-slider {
max-height: 450px;
overflow: hidden;
margin-bottom: 10px;
}
.secGallery-1 #carousel {
max-height: 130px;
margin-bottom: 50px;
}
.secGallery-1 #carousel li.slick-slide {
padding: 0 15px;
}
.secGallery-1 #carousel button,
.secGallery-1 #carousel button:before,
.secGallery-1 #carousel button:after{
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.secGallery-1 #carousel .slide-arrow{
position: absolute;
top: 50%;
transform: translate(0%, -50%);
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
}
.secGallery-1 #carousel .prev-arrow{
left: -30px;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 20px 40px 0;
border-color: transparent #fff transparent transparent;
}
.secGallery-1 #carousel .prev-arrow:after{
content: '';
left: 2px;
top: -40px;
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 20px 40px 0;
border-color: transparent #3c3c3c transparent transparent;
}
.secGallery-1 #carousel .next-arrow{
right: -30px;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 0 40px 20px;
border-color: transparent transparent transparent #fff;
}
.secGallery-1 #carousel .next-arrow:after{
content: '';
right: 2px;
top: -40px;
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 0 40px 20px;
border-color: transparent transparent transparent #3c3c3c;
}
.secGallery-1 .itemList-1 {
width: calc(100% - 4px);
margin: 0 auto;
}
.secGallery-1 .itemList-1 .box{
width: calc(25% - 2px);
height: 100%;
margin-bottom: 3px;
padding: 0;
text-align: center;
background-color: #fff;
color: #3C3C3C;
}
.secGallery-1 .itemList-1 .dummy{
background-color: inherit;
}
.secGallery-1 .itemList-1 .box .image img{
width: 100%;
height: 100%;
object-fit: cover;
}
.secGallery-1 .itemList-1::after{
content:"";
display: block;
width:calc(25% - 2px);
}
.secGallery-1 .itemList-1 li {
position: relative;
}
.secGallery-1 .itemList-1 li:before {
content: "";
display: block;
padding-top: 100%; }
.secGallery-1 .itemList-1 li span{ display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%; text-align: center;
overflow: hidden;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
}
.secGallery-1 .itemList-1 li span.noImage{
padding: 100px;
} .secGallery-1 .itemList-1 li span:before{
content: "";
height: 100%;
vertical-align: middle;
width: 0px;
display: inline-block;
}
.secGallery-1 .itemList-1 li span > *{
vertical-align: middle;
display: inline-block;
}
.secGallery-1 .itemList-1 li span > a{
max-width: 100%;
height: 100%;
max-height: 100%;
display: block;
margin-top: -100%;
}
.secGallery-1 .linkList-1 {
width: 70%;
margin: 0 auto 30px;
}
.secGallery-1 .linkList-1 li {
width: 32.5%;
height: auto;
}
.secGallery-1 .linkList-1 li a,
.secGallery-1 .linkList-1 li span{
width: 100%;
display: inline-block;
border: solid 1px #fff;
padding: 5px 10px;
text-align: left;
}
.secGallery-1 .linkList-1 li span.current{
background-color: #fff;
color: #3C3C3C;
} @media screen and (max-width: 959px) { .secGallery-1 #carousel li.slick-slide {
padding: 0;
margin: 0 2px;
}
.secGallery-1 #carousel img {
width: 100%;
height: auto;
}
} @media screen and (max-width: 767px) {
.secGallery-1 .linkList-1{
width: 70%;
}
.secGallery-1 .linkList-1 li{
width: 100%;
font-size: 14px;
margin-bottom: 10px;
}
.secGallery-1 .linkList-1 li:last-child{
margin-bottom: 0;
}
.secGallery-1 .itemList-1{
width: 100%;
display: flex;
}
.secGallery-1 .itemList-1 .box{
width: calc(50% - 5px);
}
.secGallery-1 .itemList-1 .box{
width: 49.5%;
margin-bottom: 1%;
}
.secGallery-1 .itemList-1 .box:nth-child(odd){
margin-right: 0.5%;
}
.secGallery-1 .itemList-1 .box:nth-child(even){
margin-left: 0.5%;
}
.works-template-default .head-3 .pageTitle{
top: unset;
bottom: -50%;
width: 80%;
}
.works-template-default .head-3 .pageTitle .title{
font-size: 26px;
line-height: 1.5em;
text-align: left;
}
.works-template-default .secA-1 .lead{
font-size: 14px;
margin-top: 5em;
text-align: left;
line-height: 1.75em;
}
.works-template-default .titleList li:last-child{
border-bottom: solid 1px #FFF;
}
.works-template-default .box.titleList02{
margin-bottom: 0;
}
}.secFaq-3 {
}
.secFaq-3 .inner {
}
.secFaq-3 .linkList-1 {
width: 100%;
margin: 50px auto;
}
.secFaq-3 .linkList-1 li {
width: 32.5%;
height: auto;
}
.secFaq-3 .linkList-1 li a,
.secFaq-3 .linkList-1 li span{
width: 100%;
display: inline-block;
border: solid 1px #646464;
padding: 5px 10px;
text-align: left;
}
.secFaq-3 .linkList-1 li span.current{
background-color: #fff;
color: #3C3C3C;
}
.secFaq-3 .box + .box {
margin-top: 50px;
}
.secFaq-3 .box .faqList-1 { margin-bottom: 1.5em;    
}
.secFaq-3 .box .secTitle-3 {
font-size: 18px;
line-height: 1.75;
margin-bottom: 0.25em;
}
.secFaq-3 .box dl {
margin-bottom: 1px;
}
.secFaq-3 .box dl dt {
padding: 1em;
background-color: #f5f5f5;
}
.secFaq-3 .box dl dt:before {
content: 'Q';
font-size: 16px;
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
display: inline-block;
margin-right: 30px;
background-color: #fff;
border-radius: 15px;
position: absolute;
}
.secFaq-3 .box dl dt span {
margin-left: 60px;
padding-right: 50px;
line-height: 30px;
display: block;
position: relative;
}
.secFaq-3 .box dl dt span::before, .secFaq-3 .box dl dt span::after {
content: "";
width: 20px;
height: 2px;
position: absolute;
background: #646464;
display: block;
right: 20px;
top: 0;
bottom: 0;
margin: auto;
transition: .5s;
}
.secFaq-3 .box dl dt span::after {
transform: rotate(-90deg);
}
.secFaq-3 .box dl.active dt span::after {
transform: rotate(0deg);
}
.secFaq-3 .box dl dd {
padding: 1em;
background-color: #fff;
display: none;
}
.secFaq-3 .box dl:first-of-type dd {
display: block;
}
.secFaq-3 .box dl dd:before {
content: 'A';
font-size: 16px;
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
display: inline-block;
margin-right: 30px;
background-color: #f5f5f5;
border-radius: 15px;
position: absolute;
}
.secFaq-3 .box dl dd span {
margin-left: 60px;
display: block;
line-height: 30px;
} @media screen and (max-width: 959px) { .secNextList .inner .back {
top: 50px;
}
.secNextList .inner .prev,
.secNextList .inner .next {
}
.secNextList .inner .prev + .next {
margin-left: 2em;
} .secFaq-3 .linkList-1{
width: 100%;
}
.secFaq-3 .linkList-1 li{
width: 100%;
font-size: 14px;
margin-bottom: 10px;
}
.secFaq-3 .linkList-1 li:last-child{
margin-bottom: 0;
}
.secFaq-3 .box dl dt,
.secFaq-3 .box dl dd {
padding: 0.5em;
}
.secFaq-3 .box dl dt:before,
.secFaq-3 .box dl dd:before {
margin-right: 10px;
}
.secFaq-3 .box dl dt span,
.secFaq-3 .box dl dd span {
margin-left: 40px;
}
.secFaq-3 .box dl dt span {
padding-right: 30px;
}
.secFaq-3 .box dl dt span::before,
.secFaq-3 .box dl dt span::after {
width: 15px;
right: 10px;
}
}

.contactBtn-3 {
margin-top: 6em;
}
.contactBtn-3 .row .col {
padding: 0;
overflow: hidden;
}
.contactBtn-3 iframe {
width: 90%;
min-height: 550px;
-webkit-filter: grayscale(1);
filter: grayscale(1);
}
.contactBtn-3 iframe:hover{ }
.contactBtn-3 .map-link {
position: absolute;
left: 0px;
top: 0px;
width: 190px;
height: 40px;
z-index: 99;
text-align: center;
color: #fff;
background: #A38C00;
}
.contactBtn-3 .map-link:before {
content: '';
width: 30px;
height: 40px;
position: absolute;
top: 10px;
left: 15px;
background: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/map_icon.svg) no-repeat;
}
.contactBtn-3 .map-link a {
width: 100%;
line-height: 40px;
height: 40px;
color: #fff !important;
padding-left: 20px;
}
.contactBtn-3 .map {
width: 90%;
}
.contactBtn-3 div.row>h2 {
text-align: center;
}
.contactBtn-3 div.info_title_box {
margin-bottom: 1.5em;
justify-content: flex-start;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.contactBtn-3 div.info_title_box img {
width: 75px;
margin: 0 1em 0 0;
}
.contactBtn-3 div.info_title_box h2.info_title {
margin-top: 0;
margin-bottom: 0.3em;
font-weight: 600;
letter-spacing: 0.03rem;
text-align: left;
}
.contactBtn-3 div.info_title_box p.info_title_rb {
font-weight: 600;
text-align: left;
}
.contactBtn-3 div.info_address_box {
}
.contactBtn-3 div.info_address_box p {
font-weight: 400;
margin-bottom: 0.3em;
}
.contactBtn-3 div.info_address_box p.info_address {
}
.contactBtn-3 div.info_address_box p.info_tel {
}
.contactBtn-3 div.info_address_box p.info_near_access {
font-size: 12px;
}
.contactBtn-3 div.opening_hours {
margin: 2em 0 1em;
}
.contactBtn-3 div.opening_hours dl {
padding: 0.1em 0 0;
margin: 0;
margin-bottom: 1em;
}
.contactBtn-3 div.opening_hours dl dt {
max-width: 180px;
padding-bottom: 5px;
min-width: 100px;
border-bottom: solid 1px #000;
margin-bottom: 10px;
font-size: 0.85rem;
}
.contactBtn-3 div.opening_hours dl dd {
line-height: 1.25;
padding-bottom: 3px;
margin: 0;
}
.contactBtn-3 div.opening_hours dl dd span.weekday {
letter-spacing: 0.77em;
margin-right: -0.5em;
}
.contactBtn-3 div.opening_hours dl dd span.holiday {
letter-spacing: 0.04em;
margin-right: 0.2em;
}
.contactBtn-3 div.opening_hours dl dd span.close {
letter-spacing: 0.34em;
margin-right: -0.2em;
}
.contactBtn-3 div.contact_link {
}
.contactBtn-3 div.contact_link a.btn_link {
padding: 0.5em 2.5em;
color: #000;
background-color: transparent;
border: solid 1px #000;
border-radius: 5px;
}
.contactBtn-3 div.contact_link a:hover.btn_link {
background: #000;
color: #fff;
opacity: 1;
} @media screen and (max-width: 1119px) {}  @media screen and (max-width: 959px) {
.contactBtn-3 {
margin-top: 3em;
}
.contactBtn-3 iframe {
max-width: 100%;
width: 100%;
min-height: 400px;
}
.contactBtn-3 div.contact_link a.btn_link {
display: block;
width: 100%;
padding: 0;
text-align: center;
height: 4em;
line-height: 4em;
}
.contactBtn-3 div.info_title_box {
width: 100%;
margin: 1em auto 2em;
text-align: center;
}
.contactBtn-3 div.info_title_box h2.info_title {
padding-top: 0.2em;
text-align: center;
}
.contactBtn-3 div.info_title_box p.info_title_rb {
text-align: center;
}
.contactBtn-3 div.info_title_box img {
margin: 0.5em auto 1em;
}
.contactBtn-3 div.info_address_box p.info_address {
text-align: center;
}
.contactBtn-3 div.info_address_box p.info_tel {
text-align: center;
}
.contactBtn-3 div.info_address_box p.info_near_access {
text-align: center;
}
.contactBtn-3 div.opening_hours {
display: table;
margin: 2em auto 0;
}
.contactBtn-3 div.opening_hours dl:last-child {
margin-left: 0;
margin-bottom: 0;
}
.contactBtn-3 div.opening_hours dl dt {
max-width: 220px;
text-align: center;
margin: 0 auto 1em;
}
.contactBtn-3 div.opening_hours dl dd {
max-width: 220px;
text-align: center;
margin: 0 auto 0.5em;
}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) {}.secBanner-2{
}
.bg-white01 + .secBanner-2{
margin: 0;
}
.secBanner-2 .inner{
max-width: inherit;
}
.secBanner-2 .inner ul {
justify-content: space-evenly;
margin: 2% 0;
}
.secBanner-2 .inner ul li {
width: 47%;
}
.secBanner-2 .inner ul li img {
}
.secBanner-2 .inner ul li>div {
padding: 50px 30px;
}
.secBanner-2 .inner ul li a {
color: #fff;
}
.secBanner-2 .inner ul li a:hover {
opacity: 1;
}
.secBanner-2 .inner ul li a>span {
width: calc(100% - 100px);
}
.secBanner-2 .inner ul li .secTitle-3 {
text-align: left;
}
.secBanner-2 .inner ul li .secTitle-3 span {
font-size: 28px;
line-height: 1;
letter-spacing: 0.035em;
color: #fff;
}
.secBanner-2 .inner ul li .secTitle-3 + p {
font-size: 14px;
line-height: 2;
letter-spacing: 0.12em;
}
.secExBanner-2 .inner .link-banner {
}
.secExBanner-2 .inner .link-banner a {
padding: 50px;
display: block;
}
.secExBanner-2 .inner .link-banner a:hover {
opacity: 1;
background: #f5f5f5;
color: #000;
}
.secExBanner-2 .inner .link-banner a:hover .secTitle-3 {
color: #000;
}
.secExBanner-2 .inner .link-banner a.next-arrow01.border-black:hover:after {
border-top-color: #000;
border-right-color: #000;
}
.secExBanner-2 .inner .link-banner .box {
}
.secExBanner-2 .inner .link-banner .secTitle-3 {
font-size: 22px;
text-align: left;
}
.secExBanner-2 .inner .link-banner .secTitle-3 span {
font-size: 22px;
line-height: 1;
letter-spacing: 0.15em;
}
.secExBanner-2 .inner .link-banner .secTitle-3 + p {
letter-spacing: 0.12em;
}
@media screen and (max-width: 767px){
.secBanner-2 .inner{
width: 100%;
}
.secBanner-2 .inner ul {
margin: 0;
}
.secBanner-2 .inner ul li{
width: 100%;
margin-bottom: 5px;
}
.secBanner-2 .inner ul li:last-child{
margin-bottom: 0px;
}
.secBanner-2 .inner ul li>div{
width: 70%;
}
.secBanner-2 .inner ul li .secTitle-3 + p {
line-height: 1.5;
}
.secExBanner-2 .inner .link-banner a{
padding: 10% 16% 10% 7%;
}
}.fbanner_btn2 {
position: fixed;
left: 0px;
bottom: 60px;
width: 270px;
height: 78px;
z-index: 100;
text-align: center;
color: #fff;
background: #A38C00;
box-shadow: 8px 8px 10px rgba(0,0,0,0.5);
}
.fbanner_btn2 a {
color: #fff !important;
padding: 18px 0px 18px 30px;
display: inline-block;
width: 100%;
box-sizing: border-box;
}
.fbanner_btn2 span.catchcopy{
max-width: 100%;
display: block;
font-size: 15px;
margin-bottom: 0.3em;
line-height: 1.32;
}
.fbanner_btn2 span.title{
max-width: 100%;
font-size: 19px;
line-height: 1.2;
letter-spacing: 0.005;
display: block;
text-align: center;
}
.fbanner_btn2:before {
content: "";
display: block;
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/icon-cart.svg);
background-repeat: no-repeat;
width: 50px;
height: 50px;
position: absolute;
top: 50%;
left: 18px;
transform: translateY(-50%) translateX(0%);
-webkit- transform: translateY(-50%) translateX(0%);    
}
.fbanner_btn2:after {
content: "";
display: block;
width: 25px;
height: 25px;
border-top: solid 1px #fff;
border-right: solid 1px #fff;
position: absolute;
top: 50%;
right: 15px;
transform: translateY(-50%) translateX(0%) rotate(45deg);
-webkit- transform: translateY(-50%) translateX(0%) rotate(45deg);
}
.fbanner_btn2:hover{
opacity: 0.95;
}
@media screen and (max-width: 767px){
.fbanner_btn2{
position: fixed;
width: 80%;
min-width: 260px;
line-height: 75px;
height: 75px;
z-index: 99;
top: unset;
bottom: 20px;
left: 50%;
transform: translateY(0%) translateX(-50%);
-webkit- transform: translateY(0%) translateX(-50%);
margin: auto;
padding: 12px 0;
}
.fbanner_btn2 a{
padding: 0px 0px 0px 30px;
}
.fbanner_btn2 span.title {
max-width: 280px;
padding: 0;
line-height: 1;
border: none;
margin: 0 auto;
}
.fbanner_btn2 span.banner {
position: absolute;
top: 50%;
right: 20px;
transform: translateY(-50%) translateX(0%);
-webkit- transform: translateY(-50%) translateX(0%);
}
}
@media screen and (max-width: 320px){
.fbanner_btn2 span.catchcopy,
.fbanner_btn2 span.title {
text-indent: 0px;
}
}
 
#sp_global_navi {
display: none;
}
#menu_btn {
display: none;
}
@media screen and (max-width: 959px) { #sp_global_navi {
display: none;
position: fixed;
top: 0;
left: 0;
z-index: 100;
width: 100%;
height: 100vh;
display: flex;
flex-wrap: wrap;
align-items: center;
pointer-events: none;
opacity: 0;
transition: .4s;
padding: 50px 0 100px;
overflow-y: auto;
}
#sp_global_navi.active {
pointer-events: auto;
opacity: 1;
}
#sp_global_navi .navigation-container,
#sp_global_navi .sub-navigation-container {
height: auto;
margin-top: 15px;
}
#sp_global_navi .fmtBtn {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
#sp_global_navi .secTitle-2 {
position: relative;
top: 0;
left: 0;
text-align: center;
margin: 0 auto;
}
#sp_global_navi .secTitle-2 .s-title {
display: block;
margin-top: 0.4em;
font-size: 21px;
line-height: 1.75;
letter-spacing: 0.1em;        
}
#sp_global_navi .secTitle-2 .title {
font-size: 28px;
}
#sp_global_navi ul {
width: 100%;
margin-top: 0;
display: block;
}
#sp_global_navi ul:nth-of-type(2) {
width: 90px;
height: auto;
display: flex;
margin: auto;
margin-bottom: 40px;
}
#sp_global_navi ul:nth-of-type(2) li {
width: 25px;
margin-top: 0;
}
#sp_global_navi ul li {
width: 80%;
margin: 0 auto;
-webkit-writing-mode: horizontal-tb;
-ms-writing-mode: horizontal-tb;
writing-mode: lr-tb;
}
#sp_global_navi ul li:nth-of-type(n+7) {
display: block;
}
#sp_global_navi ul li + li {
margin-top: 15px;
}
#sp_global_navi ul li a {
width: 100%;
display: block;
text-align: center;
color: #fff;
font-size: 13px;
padding: 0;
}
#sp_global_navi ul li a.now {
color: #fff;
}
#sp_global_navi ul li a span {
font-weight: 500;
font-size: 15px;
display: block;
position: relative;
}
#sp_global_navi ul li a span.en {
display: none;
}
#sp_global_navi ul li a::before {
display: none;
}
#sp_global_navi li:hover a {
color: #fff;
}
#sp_global_navi li a.now {
color: #fff;
}
#sp_global_navi li::before{
display: none;
}
#sp_global_navi .navigation-container ul li a:hover::after {
display: none;
} #menu_btn {
width: 30px;
height: 30px;
display: block;
z-index: 101;
position: fixed;
z-index: 101;
top: 20px;
right: 20px;
}
#menu_btn span {
width: 100%;
height: 2px;
display: block;
margin: auto;
position: absolute;
left: 0;
right: 0;
background: #4D4D4D;
transition: .4s;
}
#menu_btn span:nth-of-type(1) {
top: 0;
}
#menu_btn span:nth-of-type(2) {
top: 0;
bottom: 0;
z-index: -1;
}
#menu_btn span:nth-of-type(3) {
bottom: 0;
}
#menu_btn.active span {
background: #fff;
}
#menu_btn.active span:nth-of-type(1) {
transform: translateY(14px) rotate(-135deg);
}
#menu_btn.active span:nth-of-type(2) {
opacity: 0;
}
#menu_btn.active span:nth-of-type(3) {
transform: translateY(-15px) rotate(135deg);
}
}

.en {
letter-spacing: 0.035em;
}
.secTitle-1{
font-size: 50px;
text-align: center;
font-weight: normal;
margin-bottom: 25px;
letter-spacing: 0.15em;
letter-spacing: 7px;
line-height: 1.75;
color: #000;
}
.secTitle-2{
font-size: 28px;
text-align: center;
font-weight: normal;
letter-spacing: 0.15em;
line-height: 1.75;
color: #000;
}
.secTitle-2.small{
font-size: 21px;
}
.secTitle-2 span{
font-size: 21px;
text-indent: -2px;
margin-bottom: 0.1em;
font-size: 80%;
display: block;
}
.secTitle-2 span.en{
font-size: 100%;
}
.secTitle-2.nmb { margin-bottom: 25px;
}
.secTitle-2.wmb { margin-bottom: 40px;
}
.secTitle-3{
font-size: 22px;
font-weight: normal;
line-height: 1.5;
letter-spacing: 0.15em;
text-align: left;
color: #000;
}
.secTitle-3.small{
font-size: 18px;
}
.secTitle-3.force{
font-size: 22px !important;
}
.secTitle-3.nmb { margin-bottom: 25px;
}
.secTitle-3.wmb { margin-bottom: 50px;
}
.secTitle-3 span{
font-size: 80%;
display: block;
}
.secTitle-3 span.en{
font-size: 100%;
}
.secTitle-4{
text-align: left;
font-size: 18px;
font-weight: normal;
line-height: 1.5;
letter-spacing: 0.1em;
color: #646464;
}
.secTitle-4.force{
font-size: 18px !important;
}
.secTitle-4 span{
font-size: 80%;
}
.secTitle-4 span.en{
font-size: 100%;
}
.secTitle-5{
text-align: left;
font-size: 16px;
font-weight: normal;
line-height: 1.5;
letter-spacing: 0.1em;
color: #646464;
}
.secTitle-5.force{
font-size: 16px !important;
}
.secTitle-5 span{
font-size: 80%;
display: block;
}
.secTitle-5 span.en{
font-size: 100%;
}
.en{
letter-spacing: 0.1em;
}
p {
font-size: 14px;
line-height: 1.5;
letter-spacing: 0.01em;
}
.lead {
font-size: 16px;
line-height: 2;
letter-spacing: 0.1em;
text-align: center;
}
.txt{
font-size: 14px;
line-height: 2;
letter-spacing: 0.1em;
text-align: justify;
}
.annotation, .attention, .additional {
font-size: 10px !important;
}
.xsmall-text {
font-size: 10px !important;
line-height: 1.25;
}
.small-text {
font-size: 12px !important;
line-height: 1.5;
}
.small-text2 {
font-size: 12px !important;
}
.normal-text {
font-size: 14px !important;
line-height: 1.5;
}
.normal-text2 {
font-size: 16px !important;
}
.lb-text { font-size: 18px !important;
line-height: 1.5;
}
.lb-text2 {
font-size: 21px !important;
line-height: 1.5;
}
.lb-text3 {
font-size: 24px !important;
}
.big-text {
font-size: 28px !important;
}
.big-text2 {
font-size: 50px !important;
} .narrow-lh {
line-height: 1 !important;
}
.narrow-lh2 {
line-height: 1.25 !important;
}
.nlh {
line-height: 1.5 !important;
}
.nlh2 {
line-height: 1.75 !important;
}
.wlh {
line-height: 2 !important;
} .narrow-ls {
letter-spacing: 0 !important;
}
.narrow-ls2 {
letter-spacing: 0.01em !important;
}
.nls {
letter-spacing: 0.1em !important;
}
.nls2 {
letter-spacing: 0.2em !important;
}
.wls {
letter-spacing: 0.3em !important;
} _::-webkit-full-page-media, _:future, :root .secTitle-1 {
letter-spacing: 5px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-2 {
letter-spacing: 2px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-3 {
letter-spacing: 1px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-4 {
letter-spacing: 1px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-5 {
letter-spacing: 1px;
} @media screen and (max-width: 479px) { .secTitle-1{
font-size: 5.2vw !important;
}
.secTitle-2{
font-size: 5.2vw !important;
}
.secTitle-2.force{
font-size: 5.2vw !important;
}
.secTitle-2.nmb { margin-bottom: 15px;
}
.secTitle-2.wmb { margin-bottom: 30px;
}
.secTitle-2 span{
font-size: 36px;
font-size: 5vw !important;
}
.secTitle-2 span.en{
font-size: 5.5vw !important;
}
.secTitle-3{
font-size: 5.4vw !important;
line-height: 1.5;
margin-bottom: 0.5rem;
}
.secTitle-3.force{
font-size: 6.4vw !important;
}
.secTitle-3.small{
font-size: 18px !important;
}
.secTitle-3.nmb { margin-bottom: 15px;
}
.secTitle-3.wmb { margin-bottom: 30px;
}
.secTitle-3 span{
font-size: 4.12vw !important;
}
.secTitle-3 span.en{
font-size: 6.4vw !important;
}
.secTitle-4{
font-size: 4.25vw !important;
}
.secTitle-4 span{
font-size: 4vw !important;
}
.secTitle-4 span.en{
font-size: 4.25vw !important;
}
.secTitle-5{
font-size: 4vw !important;
}
.secTitle-5 span{
font-size: 3.85vw !important;
}
.secTitle-5 span.en{
font-size: 4vw !important;
}
.heading {
font-size: 5.5vw !important;
margin-bottom: 15px !important;
}
.en {}
p, .txt{
font-size: 14px !important;
}
.lead {
font-size: 14px !important;
}
.lead.spbr {
text-align: justify !important;
}
.txt.spbr{
text-align: justify !important;
}
p.small {
font-size: 10px !important;
}
.xsmall-text {
font-size: 10px !important;
line-height: 1.25;
}
.small-text {
font-size: 10px !important;
line-height: 1.25;
}
.small-text2 {
font-size: 14px !important;
}
.normal-text {
font-size: 14px !important;
line-height: 1.25;
}
.normal-text2 {
font-size: 14px !important;
}
.lb-text { font-size: 18px !important;
line-height: 1.5;
}
.lb-text2 {
font-size: 18px !important;
line-height: 1.5;
}
.big-text {
font-size: 21px !important;
}
.big-text2 {
font-size: 30px !important;
} _::-webkit-full-page-media, _:future, :root .secTitle-1 {
letter-spacing: 1px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-2 {
letter-spacing: 1px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-3 {
letter-spacing: 1px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-4 {
letter-spacing: 0px;
}
_::-webkit-full-page-media, _:future, :root .secTitle-5 {
letter-spacing: 0px;
}
.swiper-button-next, .swiper-button-prev {
width: 20px;
height: 20px;
margin-top: -10px;
-moz-background-size: 20px 20px;
-webkit-background-size: 20px 20px;
background-size: 20px 20px;
}
.txt{letter-spacing: 0.01em;}
}
.btn {
width: 130px;
}
#top .more-link01 a{
margin: 1.5em 0 0;
}
.news #globalNavi.bg-transparent,
#faq #globalNavi.bg-transparent,
#contact #globalNavi.bg-transparent,
#sitemap #globalNavi.bg-transparent,
.single #globalNavi.bg-transparent {
background-color: #fff !important;
opacity: 0.8;
}
.news #globalNavi.bg-transparent .navigation-container ul li a{color: #000 !important;}
.news #globalNavi.bg-transparent .navigation-container ul li a::after{background-color: #000 !important;}
#faq #globalNavi.bg-transparent .navigation-container ul li a{color: #000 !important;}
#faq #globalNavi.bg-transparent .navigation-container ul li a::after{background-color: #000 !important;}
#contact #globalNavi.bg-transparent .navigation-container ul li a{color: #000 !important;}
#contact #globalNavi.bg-transparent .navigation-container ul li a::after{background-color: #000 !important;}
#sitemap #globalNavi.bg-transparent .navigation-container ul li a{color: #000 !important;}
#sitemap #globalNavi.bg-transparent .navigation-container ul li a::after{background-color: #000 !important;}
.single #globalNavi.bg-transparent .navigation-container ul li a{color: #000 !important;}
.single #globalNavi.bg-transparent .navigation-container ul li a::after{background-color: #000 !important;}
#cafe #globalNavi.bg-transparent .navigation-container ul li a{color: #000 !important;}
#cafe #globalNavi.bg-transparent .navigation-container ul li a::after{background-color: #000 !important;}
.news #globalNavi.bg-transparent .fmtBtn a,
#faq #globalNavi.bg-transparent .fmtBtn a,
#contact #globalNavi.bg-transparent .fmtBtn a,
#sitemap #globalNavi.bg-transparent .fmtBtn a,
.single #globalNavi.bg-transparent .fmtBtn a,
#cafe #globalNavi.bg-transparent .fmtBtn a{
border-color: #000;
color: #000 !important;
}
.news #globalNavi.bg-transparent .fmtBtn01 a::before,
#faq #globalNavi.bg-transparent .fmtBtn01 a::before,
#contact #globalNavi.bg-transparent .fmtBtn01 a::before,
#sitemap #globalNavi.bg-transparent .fmtBtn01 a::before,
.single #globalNavi.bg-transparent .fmtBtn01 a::before,
#cafe #globalNavi.bg-transparent .fmtBtn01 a::before{
background-image: url(//luna-cafe.jp/wp/wp-content/themes/design-hp_format_2020.04/library/images/common/contact_icon_bk.svg);
}
.news #globalNavi.bg-transparent .wh,
#faq #globalNavi.bg-transparent .wh,
#contact #globalNavi.bg-transparent .wh,
#sitemap #globalNavi.bg-transparent .wh,
.single #globalNavi.bg-transparent .wh,
#cafe #globalNavi.bg-transparent .wh{
display: none;
}
.news #globalNavi.bg-transparent .bk,
#faq #globalNavi.bg-transparent .bk,
#contact #globalNavi.bg-transparent .bk,
#sitemap #globalNavi.bg-transparent .bk,
.single #globalNavi.bg-transparent .bk,
#cafe #globalNavi.bg-transparent .bk{
display: block;
}
.news #globalNavi.bg-transparent .logo .big,
#faq #globalNavi.bg-transparent .logo .big,
#contact #globalNavi.bg-transparent .logo .big,
#sitemap #globalNavi.bg-transparent .logo .big,
.single #globalNavi.bg-transparent .logo .big {
display: none;
}
.news #globalNavi.bg-transparent .logo .small,
#faq #globalNavi.bg-transparent .logo .small,
#contact #globalNavi.bg-transparent .logo .small,
#sitemap #globalNavi.bg-transparent .logo .small,
.single #globalNavi.bg-transparent .logo .small {
display: block;
}
.type-head-3 main,
.type-head-3 #pageHeader{padding-left: 160px;}
.type-head-1 .pageTitle {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
.type-head-1 .pageTitle .catch {
font-size: 38px;
line-height: 1;
letter-spacing: 0.035em;
text-align: center;
}
.type-head-1 .pageTitle .title {
font-size: 38px;
line-height: 1;
letter-spacing: 0.035em;
text-align: center;
margin-bottom: 0.25em;
}
.type-head-1 .pageTitle .s-title {
font-size: 18px;
line-height: 1;
letter-spacing: 0.15em;
text-align: center;
}
#top.type-head-1 .pageTitle {
top: 20vh;
left: auto;
right: 80px;
transform: none;
}
#top.type-head-1 .pageTitle .catch {
font-size: 40px;
line-height: 1.5;
letter-spacing: 0.195em;
text-align: left;
margin-bottom: 0.5em;
}
#top.type-head-1 .pageTitle .s-title {
font-size: 16px;
text-align: left;
margin-bottom: 0.5em;
text-indent: 0.5em;
}
#top.type-head-1 .pageTitle .title {
font-size: 19px;
text-align: left;
text-indent: 0.5em;
}
.type-head-1 .secBanner-2 {
margin-bottom: 0 !important;
}
.type-head-1 #contactBtn {
padding: 75px 0;
margin-bottom: 0 !important;
}
.type-head-1 #sub .secBanner + #contactBtn {
margin-top: 0 !important;
}
.type-head-1 .secTitle-2 {
text-align: center;
font-weight: normal;
color: #b4b4b4;
margin-bottom: 25px;
}
#sweets.type-head-1 .secTitle-2 {
font-size: 28px;
letter-spacing: 0.01em;
line-height: 1;
text-align: left;
}
.type-head-1 .secTitle-2 span{
text-align: center;
text-indent: 0;
font-size: 28px;
margin-bottom: 0.25em;
}
.type-head-1 .secTitle-2 span::before {
content: none;
}
#sweets.type-head-1 .secTitle-4 {
margin-bottom: 15px;
}
#sweets.type-head-1 .secTitle-3 {
font-weight: normal;
}
#secSweetsGallery .itemList-1 {
margin-top: 50px;
}
#secSweetsGallery .itemList-1 .secTitle-3 {
line-height: 1;
}
#secSweetsGallery .itemList-1 li {
max-width: calc((100% - 50px) / 3);
}
#secSweetsGallery .itemList-1 li:first-child {
padding-right: 50px;
}
#secSweetsGallery .itemList-1 li:not(:first-child) {
margin-right: 50px;
}
#secSweetsGallery .itemList-1 li:last-child {
margin-right: 0px;
}
#secSweetsGallery .itemList-1.gapline__ocher01 li:not(:first-child) {
border-left: solid 1px #a38c00;
padding-left: 50px;
}
#secSweetsGallery .itemList-1 .secTitle-3 + .txt {
display: inline-block;
margin-bottom: 35px;
}
.type-head-1 #secTopAbout .secTitle-2 {
text-align: left;
font-size: 28px;
line-height: 1.75;
letter-spacing: 0.035em;
}
.type-head-1 #secTopAbout .secTitle-3 {
text-align: left;
font-size: 28px;
font-weight: 500;
line-height: 1.75;
letter-spacing: 0.15em;
}
.type-head-1 #secTopAbout .txt {
line-height: 2.55;
letter-spacing: 0.12em;
margin-bottom: 50px;
}
.type-head-1 #secTopAbout .supplement {
color: #b4b4b4;
font-size: 14px;
line-height: 1.75;
letter-spacing: 0.12em;
}
.type-head-1 #secTopAbout .supplement span {
display: inline-block;
margin-bottom: 0.75em;
}
.type-head-1 #secTopAbout .supplement span.btn {
margin-bottom: 30px;
}
.type-head-1 #secTopAbout>div.flex {
justify-content: flex-start;
}
.type-head-1 #secTopAbout>div.flex .left {
margin-left: 50px;
}
.type-head-1 #secTopAbout>div.flex .left + .left {
margin-left: 65px;
}
.type-head-1 #secTopAbout img.image {
width: 100%;
max-width: 500px;
}
.type-head-1 #secTopNews .secTitle-2 {
text-align: left;
}
.type-head-1 .bgImg > .rightTxt{
color: #fff;
left: 70px;
bottom: 65px;
top: auto;
right: auto;
}
.type-head-1 .bgImg > .rightTxt .heading{
margin-bottom: 30px;
}
.type-head-1 .bgImg > .rightTxt .txt{
margin-bottom: 50px;
}
.type-head-1 .copyright {
text-align: center;
}
.type-head-1 a,
.type-head-1 a:visited {
color: #000;
}
.type-head-1 .secE-3 .itemList-1 .category a{
color: #fff;
}
.type-head-1 .secE-3 .itemList-1 .box {
padding: 0 20px 40px;
}
.type-head-1 #secCeo>div.flex {
justify-content: center;
}
.type-head-1 #secCeo>div.flex .left {
margin-left: 0;
}
.type-head-1 #secCeo>div.flex .left + .left {
width: 260px;
margin-left: 40px;
}
.type-head-1 #secCeo img.image {
width: 100%;
max-width: 410px;
}
.type-head-1 #secCeo img.image2 {
width: 100%;
max-width: 410px;
max-height: 300px;
}
.type-head-1 .brand .brand_logo {
width: 100%;
}
.type-head-1 .brand .brand_logo .image {
width: auto;
max-width: 200px;
margin: 0 auto 2em;
}
.secB-1.responsive .box,
.secB-2.responsive .box {
width: 350px;
}
.secB-1 .secTitle-2 + .txt {
margin-bottom: 30px;
}
.secB-1.responsive div.inner,
.secB-1.responsive figure,
.secB-2.responsive div.inner,
.secB-2.responsive figure {
min-height: 550px;
}
#secAbout02.secNews-2 .secTitle-2 {
margin-bottom: 0.5em;
}
#secAbout02.secNews-2 .secTitle-2 + p.txt {
text-align: center !important;
margin-bottom: 30px;
}
#secAbout02.secNews-2 .itemList-1 {
justify-content: center;
}
#secAbout02.secNews-2 .itemList-1 .box{
max-width: 280px;
margin-right: 60px;
}
#secAbout02.secNews-2 .itemList-1 .box:last-child{
margin-right: 0;
}
#secAbout02.secNews-2 .itemList-1 .box > div.image{
max-width: 280px;
max-height: 280px;
}
#secAbout02.secNews-2 .itemList-1 .secTitle-3 + p.txt {
text-align: justify;
margin-bottom: 20px;
}
#menu00 .secTitle-2 {
font-size: 28px;
letter-spacing: 0.035em;
line-height: 1;
margin-bottom: 20px;
}
#menu00 .secTitle-2 + p.txt {
letter-spacing: 0.12em;
text-align: center !important;
line-height: 1.5;
margin-bottom: 30px;
}
#menu00 + #menu01 {
margin-top: 1.5em !important;
}
.secMenu.secB-1 div.left {
width: 68%;
}
.secMenu.secB-1 figure {
width: 100%;
}
.secMenu.secB-1 .box {
width: 28%;
}
.secMenu .secTitle-3 {
font-size: 28px;
letter-spacing: 0.035em;
line-height: 1;
margin-bottom: 20px;
color: #b4b4b4;
font-weight: normal;
}
.secMenu .secTitle-3 + p.txt {
letter-spacing: 0em;
line-height: 2;
margin-bottom: 30px;
}
.secMenu .secTitle-4 {
font-size: 20px;
letter-spacing: 0.035em;
line-height: 1;
margin-bottom: 5px;
}
.secMenu .secTitle-4 span {
font-size: 14px;
letter-spacing: -0.001em;
margin-left: 0.5em;
}
.secMenu dl.menuList {
width: 180px;
margin-bottom: 5px;
line-height: 1;
letter-spacing: 0.03em;
}
.secMenu dl.menuList:last-of-type {
margin-bottom: 50px;
}
.secMenu dl.menuList dt {
}
.secMenu dl.menuList dd {
}
.secMenu .secTitle-4 + dl.menuList {
margin-bottom: 25px;
}
.secMenu p.linkTitle {
font-size: 11px;
letter-spacing: 0.003;
margin-top: 50px;
margin-bottom: 0.75em;
}
.secMenu div.btn + p.linkTitle {
margin-top: 30px;
}
.secMenu div.btn:last-child {
margin-bottom: 5px;
}
#cafe .secG-3 .itemList-2 .image {
max-width: 450px;
}
#cafe .secG-3 .itemList-2 .box {
margin-left: 50px;
}
#secGallery .secTitle-2 {
font-size: 28px;
letter-spacing: 0.035em;
line-height: 1;
margin-bottom: 20px;
}
#secGallery .secTitle-2 + p.txt {
letter-spacing: 0.12em;
text-align: center;
line-height: 1;
margin-bottom: 50px;
}
#secGallery #carousel{
max-height: 130px;
}
#secGallery #carousel .prev-arrow:after,
#secGallery #carousel .next-arrow:after{
content: "";
display: block;
width: 0;
height: 0;
position: absolute;
border-style: solid;
top: 50%;
transform: translateY(-50%) translateX(0%);
-webkit- transform: translateY(-50%) translateX(0%);
}
#secGallery #carousel .prev-arrow{
left: -20px;
border-width: 30px 15px 30px 0;
border-color: transparent #000 transparent transparent;
}
#secGallery #carousel .next-arrow{
right: -20px;
border-width: 30px 0 30px 15px;
border-color: transparent transparent transparent #000;
}
#secGallery #carousel .prev-arrow:after {
left: 2px;
border-width: 30px 15px 30px 0;
border-color: transparent #fff transparent transparent;
}
#secGallery #carousel .next-arrow:after {
right: 2px;
border-width: 30px 0 30px 15px;
border-color: transparent transparent transparent #fff;
}
#secGallery #main-slider .overtext{
bottom: 1em;
left: auto;
right: 1.5rem;
}
#secFacilities .secTitle-2 {
margin-bottom: 0.5em;
}
#secFacilities .itemList-1{
padding-bottom: 0px;
}
#secFacilities .itemList-1 .box{
margin-bottom: 0px;
}
#secFacilities .itemList-1 .box:nth-child(n+3) {
margin-top: 70px;
}
#secFacilities dl.machineSpec {
}
#secFacilities dl.machineSpec + dl{
margin-top: 1.75em;
}
#secFacilities dl.machineSpec > dt {
width: 16%;
border-right: solid 1px #000;
padding-right: 5%;
font-size: 20px;
box-sizing: border-box;
}
#secFacilities dl.machineSpec > dt.small {
font-size: 14px;
}
#secFacilities dl.machineSpec > dt span {
font-size: 10px;
}
#secFacilities dl.machineSpec > dd {
width: 100%;
}
#secFacilities dl.machineSpec > dt + dd {
width: 78%;
}
#secFacilities dl.machineSpec > dd > dl {
letter-spacing: 0.12rem;
line-height: 1.5;
margin-bottom: 1em;
}
#secFacilities dl.machineSpec > dd > dl:last-child {
margin-bottom: 0;
}
#secFacilities dl.machineSpec > dd > dl > dt {
font-size: 12px;
color: #b4b4b4;
}
#secFacilities dl.machineSpec > dd > dl > dd {
font-size: 15px;
}
#secFacilities dl.machineSpec > dd > dl > dd.small {
font-size: 12px;
}
#secGoods {
}
#secGoods figure {
max-width: 125px;
height: 65px;
margin: 0 auto 50px;
}
#secGoods dl.goodsList {
width: 45%;
margin-bottom: 2em;
}
#secGoods dl.goodsList:nth-child(2n) {
width: 50%;
}
#secGoods .gap:nth-child(2n) dl.goodsList:nth-child(2n-1) {
width: 50%;
margin-left: 10%;
}
#secGoods .gap:nth-child(2n) dl.goodsList:nth-child(2n) {
width: 40%;
}
#secGoods dl.goodsList dt{
width: 60%;
}
#secGoods dl.goodsList dd{
width: 40%;
}
.single-information .secA-1 .secTitle-1 {
font-weight: bold;
margin-bottom: 1.67em;
text-align: left;
}
.single-information main #content img {
max-width: 100%;
max-height: 300px;
object-fit: cover;
margin-bottom: 1em;
}
.secExBanner-2 .inner .link-banner a.next-arrow02.border-black:after {
border-color: transparent transparent transparent #e6e6e6;
}
.secBanner-2 .inner ul li a.next-arrow02.border-black:after {
border-color: transparent transparent transparent #e6e6e6;
}
.secContact div.contactForm dd span input, .secContact div.contactForm dd span textarea, .secContact div.contactForm dd span select {
border: solid 1px #000;
}
.secContact div.contactForm dl#privacy dd div.pp {
border: solid 1px #000;
}
.secContact div.contactForm dl#privacy dd p label {
color: inherit;
}
[type="checkbox"]:checked+span:not(.lever):before {
border-right-color: #5a5a5a;
border-bottom-color: #5a5a5a;
}
[type="checkbox"]+span:not(.lever):before, [type="checkbox"]:not(.filled-in)+span:not(.lever):after {
border-color: #5a5a5a;
}
.type-head-1 .secSitemap .inner ul.sitemapList li {
border-color: #000;
}
.type-head-1 .secSitemap .inner ul.sitemapList li:first-child {
border-color: #000;
} #concept .secB-1 .secTitle-3 + .txt:last-child {
margin-bottom: 50px !important; 
} #concept #concept_message img.ofi.image2.pbox03 {
width: 50%;
margin: auto;
}
@media screen and (max-width: 959px) {
.btn {
width: 200px;
margin: 0 auto 5px;
display: block !important;
}
.row .col.gap {
padding-right: 0;
padding-left: 0;
margin-bottom: 5%;
}
.row .col.gap:first-child {
padding-right: 0;
}
.row .col.gap:last-child {
padding-left: 0;
}
#top.type-head-1 .pageTitle {
width: calc(100% - 2em);
left: 2em;
top: 10vh;
bottom: 120px;
}
#top.type-head-1 .pageTitle .catch {
font-size: 6.5vw;
}
.type-head-1 .secTitle-2 {
margin-bottom: 15px;
}
.type-head-1 #secTopAbout img.image {
width: 75%;
margin: 0 auto 35px;
}
.type-head-1 #secTopAbout .secTitle-3 {
text-align: center;
}
.type-head-1 #secTopAbout .txt {
margin-bottom: 25px;
text-align: center !important;
}
.type-head-1 #secTopAbout>div.flex .left,
.type-head-1 #secTopAbout>div.flex .left + .left {
margin-left: 0;
float: none !important;
}
.type-head-1 #secTopAbout>div.flex .left + .left {
margin-top: 3em;
}
.type-head-1 .bgImg > .rightTxt {
color: #000;
position: relative;
left: auto;
bottom: auto;
margin-top: 3em;
}
.type-head-1 .bgImg > .rightTxt .txt {
margin-bottom: 0px;
}
.type-head-1 #secTopAbout .supplement span.btn a,
.type-head-1 .secTopService .btn a {
margin-left: 0;
}
.type-head-1 #secTopNews .itemList-1 .box {
width: 100%;
margin: 0 auto 15px;
}
.secNews-2 .itemList-1 .box > div.noImage img{
min-width: 100px;
}
.type-head-1 #secTopNews .itemList-1 .box > div.image {
width: 50%;
min-width: 100px;
height: auto;
}
.secNews-2 .itemList-1 .txt{
margin-top: 0;
}
.type-head-1 #secTopNews .itemList-1 .box > div.vmiddle-flex{
padding-left: 1em;
}
.type-head-1 #contactBtn {
padding: 50px 0;
}
.type-head-1 .totop {
display: none;
}
.type-head-1 #secTopCopy .secTitle-1 {
text-align: left;
}
.type-head-1 #secCeo img.image {
width: 75%;
margin: 0 auto 0;
}
.type-head-1 #secCeo>div.flex .left + .left {
width: 100%;
margin-left: 0;
margin-top: 3em;
}
.type-head-1 #secCeo>div.flex .left .txt {
margin-bottom: 1.5em;
letter-spacing: 0.01em;
}
#top .secNews-2 .itemList-1 .box {
max-width: 320px;
}
#sweets.type-head-1 .secTitle-4 {
margin-top: 15px;
margin-bottom: 0;
}
#secSweetsGallery section {
margin-top: 10px !important;
}
#secSweetsGallery .itemList-1 {
margin-top: 25px;
}
#secSweetsGallery .itemList-1 .secTitle-3 {
line-height: 1;
}
#secSweetsGallery .itemList-1 li {
max-width: 100%;
margin: 0;
padding-top: 25px;
padding-left: 0 !important;
padding-right: 0 !important;
}
#secSweetsGallery .itemList-1 li:first-child {
margin-top: 30px;
}
#secSweetsGallery .itemList-1.gapline__ocher01 li:not(:first-child) {
border-left: none;
}
#secSweetsGallery .itemList-1.gapline__ocher01 li {
border-top: solid 1px #a38c00;
padding-bottom: 25px;
}
#secSweetsGallery .itemList-1.gapline__ocher01 li:last-child {
padding-bottom: 0px;
}
#secSweetsGallery .itemList-1 .secTitle-3 + .txt {
margin-bottom: 15px;
}
#secSweetsGallery .itemList-1:not(:first-child) .secTitle-3 + .txt {
margin-bottom: 0px;
}
.secB-1.responsive .box,
.secB-2.responsive .box {
width: 85%;
margin: 3em auto 0;
}
.secB-1.responsive div.inner,
.secB-1.responsive figure,
.secB-2.responsive div.inner,
.secB-2.responsive figure {
min-height: auto;
}
.secB-1 .secTitle-3 + .txt,
.secB-2 .secTitle-3 + .txt {
margin-bottom: 1.5em;
}
#secAbout02.secNews-2 .itemList-1 .box {
width: 100%;
margin-left: auto;
margin-right: auto;
margin-bottom: 50px;
}
#secAbout02.secNews-2 .itemList-1 .box:last-child {
margin-right: auto;
}
#menu00 + #menu01 {
margin-top: 0 !important;
}
.secMenu.secB-1 div.left {
width: 100%;
margin-bottom: 1.5em;
}
.secMenu.secB-1 figure {
}
.secMenu.secB-1 .box {
width: 100%;
}
.secMenu.secB-1 .additional {
position: static;
}
.secMenu dl.menuList.flex {
display: flex;
margin: 0 auto 5px;
min-width: 220px;
}
.secMenu .secTitle-4 + dl.menuList {
margin: 0 auto 30px;
}
#cafe .secG-3 .itemList-2 .image {
max-width: 100%;
margin-bottom: 30px;
}
#cafe .secG-3 .itemList-2 .box {
margin-left: 0px;
}
#secGallery .secTitle-2 + p.txt {
margin-bottom: 30px;
text-align: center !important;
}
#secFacilities .itemList-1 .box {
margin-bottom: 30px;
}
#secFacilities dl.machineSpec.flex {
display: flex;
}
#secFacilities dl.machineSpec > dd.flex {
display: flex;
}
#secGoods .inner {
padding: 10% 5%;
}
#secGoods .row .col.gap:first-child {
padding-bottom: 5%;
margin-bottom: 15%;
}
#secGoods .row .col.gap:last-child {
}
#secGoods .row .col.gap > div {
width: 80%;
margin: 0 auto;
}
#secGoods figure {
margin-bottom: 10%;
}
#secGoods dl.goodsList {
width: 100%;
margin-bottom: 1em;
}
#secGoods dl.goodsList.flex {
display: flex;
}
#secGoods dl.goodsList:nth-child(2n) {
width: 100%;
}
#secGoods .gap:nth-child(2n) dl.goodsList:nth-child(2n-1) {
width: 100%;
margin-left: 0%;
}
#secGoods .gap:nth-child(2n) dl.goodsList:nth-child(2n) {
width: 100%;
}
#secGoods dl.goodsList dt {
width: 80%;
}
#secGoods dl.goodsList dd {
width: 10%;
}
.secA-1 .lead{
letter-spacing: 0.01em;
}
.right00, .right01, .right02, .right03, .right04, .right05{
margin-top: 1em;
}
}
@media screen and (min-width: 768px){
#secGallery #main-slider{
max-width: 650px;
max-height: 400px;
margin: 0 auto 5px;
}
#secGallery #main-slider img{
width: 650px;
height: 400px;
object-fit: cover;
}
#secGallery #carousel{
max-width: 650px;
margin: 0 auto;
}
#secGallery #carousel img{
max-width: 100%;
object-fit: cover;
}
#secGallery #carousel li.slick-slide {
padding: 0 3px;
}
}