@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: 14px !important;
letter-spacing: 0.05em !important;
}
h1 {
font-size: 10px !important;
font-weight: normal !important;
letter-spacing: 0.05em !important;
line-height: 1.75 !important;
}
section {
margin: 80px 0 0 0 !important;
}
section:last-of-type {
margin: 80px 0 80px 0 !important;
}
@media screen and (max-width: 959px) {
section {
margin: 50px 0 0 0 !important;
}
section:last-of-type {
margin: 50px 0 0 0 !important;
}
}
   @font-face {
font-family: 'GFS Didot';
font-style: normal;
font-weight: 400;
src: url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/fonts/gfs-didot-v10-greek/gfs-didot-v10-greek-regular.eot); src: local('GFS Didot Regular'), local('GFSDidot-Regular'),
url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/fonts/gfs-didot-v10-greek/gfs-didot-v10-greek-regular.eot?#iefix) format('embedded-opentype'), url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/fonts/gfs-didot-v10-greek/gfs-didot-v10-greek-regular.woff2) format('woff2'), url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/fonts/gfs-didot-v10-greek/gfs-didot-v10-greek-regular.woff) format('woff'), url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/fonts/gfs-didot-v10-greek/gfs-didot-v10-greek-regular.ttf) format('truetype'), url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/fonts/gfs-didot-v10-greek/gfs-didot-v10-greek-regular.svg#GFSDidot) format('svg'); }
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;}
.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;
font-weight: bold;
}
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;
} .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;}
.didot{font-family: 'GFS Didot', serif;}
.times{font-family: 'Times New Roman', serif;}
.fwl{font-weight: lighter !important;}
.fwn{font-weight: normal !important;}
.fwm{font-weight: 500 !important;}
.fwb{font-weight: bold !important;} .fl {float: left !important;}
.fr {float: right !important;} @media screen and (max-width: 959px) {
.dummy {height: 0 !important;}
} .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;}
} .lh05{line-height: 0.5 !important;}
.lh075{line-height: 0.75 !important;}
.lh1{line-height: 1 !important;}
.lh125{line-height: 1.25 !important;}
.lh15{line-height: 1.5 !important;}
.lh175{line-height: 1.75 !important;}
.lh2{line-height: 2 !important;} .ls00{letter-spacing: 0em !important;}
.ls001{letter-spacing: 0.01em !important;margin-right: -0.01em;}
.ls005{letter-spacing: 0.05em !important;margin-right: -0.05em;}
.ls01{letter-spacing: 0.1em !important;margin-right: -0.1em;}
.ls015{letter-spacing: 0.15em !important;margin-right: -0.15em;}
.ls02{letter-spacing: 0.2em !important;margin-right: -0.2em;}
.ls025{letter-spacing: 0.25em !important;margin-right: -0.25em;}
.ls05{letter-spacing: 0.5em !important;margin-right: -0.5em;}
.ls10{letter-spacing: 1em !important;margin-right: -1em;}
.ls20{letter-spacing: 2em !important;margin-right: -2em;} .mauto {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;}
.mb60 {margin-bottom: 60px !important;}
.mb70 {margin-bottom: 70px !important;}
.mb80 {margin-bottom: 80px !important;}
.mb90 {margin-bottom: 90px !important;}
.mb100 {margin-bottom: 100px !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;}
.mt60 {margin-top: 60px !important;}
.mt70 {margin-top: 70px !important;}
.mt80 {margin-top: 80px !important;}
.mt90 {margin-top: 90px !important;}
.mt100 {margin-top: 100px !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;}
.ml25 {margin-left: 25px !important;}
.ml30 {margin-left: 30px !important;}
.ml35 {margin-left: 35px !important;}
.ml40 {margin-left: 40px !important;}
.ml45 {margin-left: 45px !important;}
.ml50 {margin-left: 50px !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;}
.mr25 {margin-right: 25px !important;}
.mr30 {margin-right: 30px !important;}
.mr35 {margin-right: 35px !important;}
.mr40 {margin-right: 40px !important;}
.mr45 {margin-right: 45px !important;}
.mr50 {margin-right: 50px !important;}
@media screen and (max-width: 767px) {
.sp-mauto {margin-left: auto !important;margin-right: auto !important;}
.sp-m00 {margin: 0 !important;}
.sp-mb {margin-bottom: 1.5em !important;}
.sp-mb00 {margin-bottom: 0 !important;}
.sp-mb05 {margin-bottom: 5px !important;}
.sp-mb08 {margin-bottom: 8px !important;}
.sp-mb10 {margin-bottom: 10px !important;}
.sp-mb15 {margin-bottom: 15px !important;}
.sp-mb20 {margin-bottom: 20px !important;}
.sp-mb25 {margin-bottom: 25px !important;}
.sp-mb30 {margin-bottom: 30px !important;}
.sp-mb35 {margin-bottom: 35px !important;}
.sp-mb40 {margin-bottom: 40px !important;}
.sp-mb45 {margin-bottom: 45px !important;}
.sp-mb50 {margin-bottom: 50px !important;}
.sp-mb60 {margin-bottom: 60px !important;}
.sp-mb70 {margin-bottom: 70px !important;}
.sp-mb80 {margin-bottom: 80px !important;}
.sp-mb90 {margin-bottom: 90px !important;}
.sp-mb100 {margin-bottom: 100px !important;}
.sp-mt {margin-top: 1.5em !important;}
.sp-mt00 {margin-top: 0 !important;}
.sp-mt05 {margin-top: 5px !important;}
.sp-mt08 {margin-top: 8px !important;}
.sp-mt10 {margin-top: 10px !important;}
.sp-mt15 {margin-top: 15px !important;}
.sp-mt20 {margin-top: 20px !important;}
.sp-mt25 {margin-top: 25px !important;}
.sp-mt30 {margin-top: 30px !important;}
.sp-mt35 {margin-top: 35px !important;}
.sp-mt40 {margin-top: 40px !important;}
.sp-mt45 {margin-top: 45px !important;}
.sp-mt50 {margin-top: 50px !important;}
.sp-mt60 {margin-top: 60px !important;}
.sp-mt70 {margin-top: 70px !important;}
.sp-mt80 {margin-top: 80px !important;}
.sp-mt90 {margin-top: 90px !important;}
.sp-mt100 {margin-top: 100px !important;}
.sp-ml00 {margin-left: 0 !important;}
.sp-ml05 {margin-left: 5px !important;}
.sp-ml08 {margin-left: 8px !important;}
.sp-ml10 {margin-left: 10px !important;}
.sp-ml15 {margin-left: 15px !important;}
.sp-ml20 {margin-left: 20px !important;}
.sp-ml25 {margin-left: 25px !important;}
.sp-ml30 {margin-left: 30px !important;}
.sp-ml35 {margin-left: 35px !important;}
.sp-ml40 {margin-left: 40px !important;}
.sp-ml45 {margin-left: 45px !important;}
.sp-ml50 {margin-left: 50px !important;}
.sp-mr00 {margin-right: 0 !important;}
.sp-mr05 {margin-right: 5px !important;}
.sp-mr08 {margin-right: 8px !important;}
.sp-mr10 {margin-right: 10px !important;}
.sp-mr15 {margin-right: 15px !important;}
.sp-mr20 {margin-right: 20px !important;}
.sp-mr25 {margin-right: 25px !important;}
.sp-mr30 {margin-right: 30px !important;}
.sp-mr35 {margin-right: 35px !important;}
.sp-mr40 {margin-right: 40px !important;}
.sp-mr45 {margin-right: 45px !important;}
.sp-mr50 {margin-right: 50px !important;}
} .p00 {padding: 0 !important;}
.pbt100 {padding: 100px 0;}
.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;}
.pl30 {padding-left: 30px !important;}
.pl40 {padding-left: 40px !important;}
.pl50 {padding-left: 50px !important;}
.pl60 {padding-left: 60px !important;}
.pl70 {padding-left: 70px !important;}
.pl80 {padding-left: 80px !important;}
.pl90 {padding-left: 90px !important;}
.pl100 {padding-left: 100px !important;}
.pr00 {padding-right: 0px !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;}
.pr30 {padding-right: 30px !important;}
.pr40 {padding-right: 40px !important;}
.pr50 {padding-right: 50px !important;}
.pr60 {padding-right: 60px !important;}
.pr70 {padding-right: 70px !important;}
.pr80 {padding-right: 80px !important;}
.pr90 {padding-right: 90px !important;}
.pr100 {padding-right: 100px !important;}
.pbox {padding: 5px 10px;}
.pbox00 {padding: 1% 5%;}
.pbox01 {padding: 10px;}
.pbox02 {padding: 20px;}
.pbox03 {padding: 30px;}
.pbox04 {padding: 40px;}
.pbox05 {padding: 50px;}
@media screen and (max-width: 767px) {
.pbox {padding: 5px 10px;}
.pbox00 {padding: 1% 5%;}
.pbox01 {padding: 10px;}
.pbox02 {padding: 20px;}
.pbox03 {padding: 20px;}
.pbox04 {padding: 20px;}
.pbox05 {padding: 30px;}
.sp-p00 {padding: 0 !important;}
.sp-pbt100 {padding: 100px 0;}
.sp-pb {padding-bottom: 1.3em !important;}
.sp-pb00 {padding-bottom: 0 !important;}
.sp-pb05 {padding-bottom: 5px !important;}
.sp-pb08 {padding-bottom: 8px !important;}
.sp-pb10 {padding-bottom: 10px !important;}
.sp-pb15 {padding-bottom: 15px !important;}
.sp-pb20 {padding-bottom: 20px !important;}
.sp-pb25 {padding-bottom: 25px !important;}
.sp-pb30 {padding-bottom: 30px !important;}
.sp-pb35 {padding-bottom: 35px !important;}
.sp-pb40 {padding-bottom: 40px !important;}
.sp-pb45 {padding-bottom: 45px !important;}
.sp-pb50 {padding-bottom: 50px !important;}
.sp-pt00 {padding-top: 0 !important;}
.sp-pt05 {padding-top: 5px !important;}
.sp-pt08 {padding-top: 8px !important;}
.sp-pt10 {padding-top: 10px !important;}
.sp-pt15 {padding-top: 15px !important;}
.sp-pt20 {padding-top: 20px !important;}
.sp-pt25 {padding-top: 25px !important;}
.sp-pt30 {padding-top: 30px !important;}
.sp-pt35 {padding-top: 35px !important;}
.sp-pt40 {padding-top: 40px !important;}
.sp-pt45 {padding-top: 45px !important;}
.sp-pt50 {padding-top: 50px !important;}
.sp-pl00 {padding-left: 0px !important;}
.sp-pl05 {padding-left: 5px !important;}
.sp-pl08 {padding-left: 8px !important;}
.sp-pl10 {padding-left: 10px !important;}
.sp-pl15 {padding-left: 15px !important;}
.sp-pl20 {padding-left: 20px !important;}
.sp-pl30 {padding-left: 30px !important;}
.sp-pl40 {padding-left: 40px !important;}
.sp-pl50 {padding-left: 50px !important;}
.sp-pl60 {padding-left: 60px !important;}
.sp-pl70 {padding-left: 70px !important;}
.sp-pl80 {padding-left: 80px !important;}
.sp-pl90 {padding-left: 90px !important;}
.sp-pl100 {padding-left: 100px !important;}
.sp-pr00 {padding-right: 0px !important;}
.sp-pr05 {padding-right: 5px !important;}
.sp-pr08 {padding-right: 8px !important;}
.sp-pr10 {padding-right: 10px !important;}
.sp-pr15 {padding-right: 15px !important;}
.sp-pr20 {padding-right: 20px !important;}
.sp-pr30 {padding-right: 30px !important;}
.sp-pr40 {padding-right: 40px !important;}
.sp-pr50 {padding-right: 50px !important;}
.sp-pr60 {padding-right: 60px !important;}
.sp-pr70 {padding-right: 70px !important;}
.sp-pr80 {padding-right: 80px !important;}
.sp-pr90 {padding-right: 90px !important;}
.sp-pr100 {padding-right: 100px !important;}
.sp-pbox {padding: 5px 10px;}
.sp-pbox00 {padding: 1% 5%;}
.sp-pbox01 {padding: 10px;}
.sp-pbox02 {padding: 20px;}
.sp-pbox03 {padding: 30px;}
.sp-pbox04 {padding: 40px;}
.sp-pbox05 {padding: 50px;}
} .fz8  {font-size:  8px !important;}
.fz9  {font-size:  9px !important;}
.fz10 {font-size: 10px !important;}
.fz11 {font-size: 11px !important;}
.fz12 {font-size: 12px !important;}
.fz13 {font-size: 13px !important;}
.fz14 {font-size: 14px !important;}
.fz15 {font-size: 15px !important;}
.fz16 {font-size: 16px !important;}
.fz17 {font-size: 17px !important;}
.fz18 {font-size: 18px !important;}
.fz19 {font-size: 19px !important;}
.fz20 {font-size: 20px !important;}
.fz21 {font-size: 21px !important;}
.fz23 {font-size: 23px !important;}
.fz24 {font-size: 24px !important;}
.fz28 {font-size: 28px !important;}
.fz30 {font-size: 30px !important;}
.fz32 {font-size: 32px !important;}
.fz36 {font-size: 36px !important;}
.fz40 {font-size: 40px !important;}
.fz44 {font-size: 44px !important;}
.fz48 {font-size: 48px !important;}
.fz53 {font-size: 53px !important;}
@media screen and (max-width: 767px) {
.sp-fz8  {font-size:  8px !important;}
.sp-fz9  {font-size:  9px !important;}
.sp-fz10 {font-size: 10px !important;}
.sp-fz11 {font-size: 11px !important;}
.sp-fz12 {font-size: 12px !important;}
.sp-fz13 {font-size: 13px !important;}
.sp-fz14 {font-size: 14px !important;}
.sp-fz15 {font-size: 15px !important;}
.sp-fz16 {font-size: 16px !important;}
.sp-fz17 {font-size: 17px !important;}
.sp-fz18 {font-size: 18px !important;}
.sp-fz19 {font-size: 19px !important;}
.sp-fz20 {font-size: 20px !important;}
.sp-fz21 {font-size: 21px !important;}
.sp-fz24 {font-size: 24px !important;}
.sp-fz28 {font-size: 28px !important;}
.sp-fz30 {font-size: 30px !important;}
.sp-fz32 {font-size: 32px !important;}
.sp-fz36 {font-size: 36px !important;}
.sp-fz40 {font-size: 40px !important;}
.sp-fz44 {font-size: 44px !important;}
.sp-fz48 {font-size: 48px !important;}
} .fsi {font-style: italic !important;}
.fso {font-style: oblique !important;} .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;
} .vwm-rl{
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
letter-spacing: 0;
font-feature-settings: normal;
text-orientation: upright;
-webkit-text-orientation: upright;
}
.vwm-lr{
-ms-writing-mode: tb-lr;
writing-mode: vertical-lr;
letter-spacing: 0;
font-feature-settings: normal;
text-orientation: upright;
-webkit-text-orientation: upright;
} .wauto{
width: auto !important;
}
.w100p{
width: 100% !important;
max-width: 100% !important;
}
.w95p{
width: 95% !important;
max-width: 95% !important;
}
.w90p{
width: 90% !important;
max-width: 90% !important;
}
.w85p{
width: 85% !important;
max-width: 85% !important;
}
.w80p{
width: 80% !important;
max-width: 80% !important;
}
.w75p{
width: 75% !important;
max-width: 75% !important;
}
.w70p{
width: 70% !important;
max-width: 70% !important;
}
.w65p{
width: 65% !important;
max-width: 65% !important;
}
.w60p{
width: 60% !important;
max-width: 60% !important;
}
.w55p{
width: 55% !important;
max-width: 55% !important;
}
.w50p{
width: 50% !important;
max-width: 50% !important;
}
.w48p{
width: 48% !important;
max-width: 48% !important;
}
.w45p{
width: 45% !important;
max-width: 45% !important;
}
.w40p{
width: 40% !important;
max-width: 40% !important;
}
.w35p{
width: 35% !important;
max-width: 35% !important;
}
.w30p{
width: 30% !important;
max-width: 30% !important;
}
.w25p{
width: 25% !important;
max-width: 25% !important;
}
.w20p{
width: 20% !important;
max-width: 20% !important;
}
.w15p{
width: 15% !important;
max-width: 15% !important;
}
.w10p{
width: 10% !important;
max-width: 10% !important;
}
.w05p{
width: 5% !important;
max-width: 5% !important;
}
.w30{width: 30px !important;}
.w60{width: 60px !important;}
.w100{width: 100px !important;}
.w140{width: 140px !important;}
.w150{width: 150px !important;}
.w200{width: 200px !important;}
.w210{width: 210px !important;}
.w300{width: 300px !important;}
@media screen and (max-width: 767px) {
.sp-wauto{
width: auto !important;
}
.sp-w100p{
width: 100% !important;
max-width: 100% !important;
}
.sp-w90p{
width: 90% !important;
max-width: 90% !important;
}
.sp-w85p{
width: 85% !important;
max-width: 85% !important;
}
.sp-w80p{
width: 80% !important;
max-width: 80% !important;
}
.sp-w75p{
width: 75% !important;
max-width: 75% !important;
}
.sp-w70p{
width: 70% !important;
max-width: 70% !important;
}
.sp-w65p{
width: 65% !important;
max-width: 65% !important;
}
.sp-w60p{
width: 60% !important;
max-width: 60% !important;
}
.sp-w55p{
width: 55% !important;
max-width: 55% !important;
}
.sp-w50p{
width: 50% !important;
max-width: 50% !important;
}
.sp-w48p{
width: 48% !important;
max-width: 48% !important;
}
.sp-w45p{
width: 45% !important;
max-width: 45% !important;
}
.sp-w40p{
width: 40% !important;
max-width: 40% !important;
}
.sp-w35p{
width: 35% !important;
max-width: 35% !important;
}
.sp-w30p{
width: 30% !important;
max-width: 30% !important;
}
.sp-w25p{
width: 25% !important;
max-width: 25% !important;
}
.sp-w20p{
width: 20% !important;
max-width: 20% !important;
}
.sp-w15p{
width: 15% !important;
max-width: 15% !important;
}
.sp-w10p{
width: 10% !important;
max-width: 10% !important;
}
.sp-w05p{
width: 5% !important;
max-width: 5% !important;
}
.sp-w30{width: 30px !important;}
.sp-w60{width: 60px !important;}
.sp-w100{width: 100px !important;}
.sp-w140{width: 140px !important;}
.sp-w150{width: 150px !important;}
.sp-w200{width: 200px !important;}
.sp-w210{width: 210px !important;}
.sp-w300{width: 300px !important;}
} .mw400{max-width:400px;} .h60{height: 60px !important;}
.h180{height: 180px !important;}
.h400{height: 400px;}
@media screen and (max-width: 767px) {
.sp-hauto{height: auto;}
.sp-h60{height: 60px !important;}
.sp-h160{height: 160px;}
.sp-h180{height: 180px !important;}
.sp-h400{height: 400px;}
.sp-h100p{height: 100%;}
.sp-h100vh{height: 100vh;}
} .separator{
width: 20px;
height: 1px;
margin: 1.5em 0;
display: block;
}
.ofv {
overflow: visible;
}
.ofx-hidden {
overflow-x: hidden;
}
.ofy-hidden {
overflow-y: hidden;
} .round{border-radius: 500px;}
.round01{border-radius: 30px;}
.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;}
.gray04{color: #969696 !important;}
.gray01 a{color: #3C3C3C !important;}
.gray02 a{color: #5a5a5a !important;}
.gray03 a{color: #828282 !important;}
.gray04 a{color: #969696 !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;}
.txt-choco{color: #534741 !important;}
.ocher01 {color: #a38c00 !important;}
.bg-transparent{background-color: transparent !important;}
.bg-white{color: #000;background-color: rgba(255,255,255,0.8) !important;}
.bg-white01{color: #3C3C3C;background-color: #fff !important;}
.bg-white02{color: #3C3C3C;background-color: rgba(255,255,255,0.8) !important;}
.bg-white03{color: #000;background-color: #f5f5f5 !important;}
.bg-white04{color: #646464;background-color: #f5f5f5 !important;}
.bg-white05{color: #000;background-color: #e2e2e2 !important;}
.bg-white06{color: #000;background-color: #fff !important;}
.bg-white07{color: #3C1000;background-color: #fff !important;}
.bg-black{color: #fff;background-color: rgba(0,0,0,0.8) !important;}
.bg-black01{color: #fff;background-color: #000 !important;}
.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-gray07{background-color: #dcdcdc !important;}
.bg-gray08{background-color: #eaeae9 !important;}
.bg-choco{color: #fff;background-color: #534741 !important;}
.bg-choco a{color: #fff;}
.bg-choco02{color: #3C1000;background-color: #A59992 !important;}
.bg-choco02 a{color: #3C1000;}
section.bg-color{
padding: 90px 0;
}
section.bg-color + section.bg-img{
margin-top: 0 !important;
}
section.bg-img + section.bg-color{
margin-top: 0 !important;
}
@media screen and (max-width: 767px) {
section.bg-color{
padding: 45px 0;
}
} .opacity01{opacity: 1;}
.opacity02{opacity: 0.8;}
.opacity03{opacity: 0.5;}
.opacity04{opacity: 0.2;}
.opacity05{opacity: 0;} .b-none{border: none !important;}
.bbb{ border-bottom: solid 1px #000 !important;
margin-bottom: 0.5em !important;
padding-bottom: 0.5em !important;
}
.bbb00{
border-bottom: solid 1px #000 !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;
}
.bbb03{
border-bottom: solid 1px #000 !important;
}
.btb{
border-top: solid 1px #000 !important;
}
.blb{
border-left: solid 1px #000 !important;
}
.brb{
border-right: solid 1px #000 !important;
}
.bbw{
border-bottom: solid 1px #fff !important;
margin-bottom: 0.5em !important;
padding-bottom: 0.5em !important;
}
.bbw00{
border-bottom: solid 1px #fff !important;
}
.bbw01{
border-bottom: solid 1px #fff !important;
margin-bottom: 0.25em !important;
padding-bottom: 5px !important;
}
.bbw02{
border-bottom: solid 1px #fff !important;
margin-bottom: 1em !important;
padding-bottom: 1em !important;
}
.bbw03{
border-bottom: solid 1px #fff !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-color-w{
border-color: #fff !important;
}
.b-color-w01{
border-color: #a0a0a0 !important;
}
.b-box-w{
border: solid 1px #fff;
}
.b-box-w01{
border: solid 1px #a0a0a0;
}
.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;
}
@media screen and (max-width: 767px) {
.sp-b-none{
border: none !important;
}
.sp-bt-none{
border-top: none !important;
}
.sp-bb-none{
border-bottom: none !important;
}
.sp-bl-none{
border-left: none !important;
}
.sp-br-none{
border-right: none !important;
}
.sp-bbb{ border-bottom: solid 1px #000 !important;
margin-bottom: 0.5em !important;
padding-bottom: 0.5em !important;
}
.sp-bbb01{
border-bottom: solid 1px #000 !important;
margin-bottom: 0.25em !important;
padding-bottom: 5px !important;
}
.sp-bbb02{
border-bottom: solid 1px #000 !important;
margin-bottom: 1em !important;
padding-bottom: 1em !important;
}
.sp-bbb03{
border-bottom: solid 1px #000 !important;
}
.sp-btb{
border-top: solid 1px #000 !important;
}
.sp-blb{
border-left: solid 1px #000 !important;
}
.sp-brb{
border-right: solid 1px #000 !important;
}
.sp-bbw{
border-bottom: solid 1px #fff !important;
margin-bottom: 0.5em !important;
padding-bottom: 0.5em !important;
}
}
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;
border-color: #000;
}
.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-color: #fff;
}
.btn01{ overflow: hidden;
}
.btn01::before{
content: "";
z-index: -1;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: -100%;
transition: .2s;
}
.btn01.txt-black::before{
background-color: #000;
}
.btn01.txt-white::before{
background-color: #fff;
}
.btn01:hover::before{
left: 0;
}
.round-btn a {
border-radius: 5px;
}
@media screen and (max-width: 959px) {
.btn {
width: 100%;
display: block;
}
.btn a {
width: 60%;
margin: 0 auto;
display: block;
}
.btn.white {
background-color: transparent !important;
}
.btn.white a {
background-color: #fff;
}
.btn-left a {
margin-left: 0;
}
.btn-center a {
}
.btn-right a {
margin-right: 0;
}
}
.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.type02:after {
right: 20px;
}
.next-arrow01.small:after {
width: 21px;
height: 21px;
}
.next-arrow01.ex-small:after {
width: 15px;
height: 15px;
}
.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;
}
.arrow-bottom{
position: relative;
}
.arrow-bottom::after{
content: '';
position: absolute;
bottom: -35%;
left: 50%;
border-bottom: solid 1px #000;
border-right: solid 1px #000;
width: 30px;
height: 30px;
transform: rotate(45deg) translateX(-50%);
-webkit-transform: rotate(45deg) translateX(-50%);
-ms-transform: rotate(45deg) translateX(-50%);
}
.arrow-top{
position: relative;
}
.arrow-top::before{
content: '';
position: absolute;
top: -35%;
left: 50%;
border-bottom: solid 1px #000;
border-right: solid 1px #000;
width: 30px;
height: 30px;
transform: rotate(45deg) translateX(-50%);
-webkit-transform: rotate(45deg) translateX(-50%);
-ms-transform: rotate(45deg) translateX(-50%);
}
.cross-bottom{
position: relative;
margin-bottom: 140px !important;
}
.cross-bottom::before,
.cross-bottom::after{
content: '';
position: absolute;
left: 50%;
bottom: -60px;
width: 100px;
height: 1px;
background-color: #000;
}
.cross-bottom::before {
-webkit-transform: translate(-50%, 0) rotate(-45deg);
transform: translate(-50%, 0) rotate(-45deg);
}
.cross-bottom::after {
-webkit-transform: translate(-50%, 0) rotate(45deg);
transform: translate(-50%, 0) rotate(45deg);
}
.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 {}
.btn-gold,
.btn-blue{
overflow: hidden;
}
.btn-gold::before{
content: "";
z-index: -1;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: -100%;
background-color: #c2ab59;
transition: .2s;
}
.btn-blue::before{
content: "";
z-index: -1;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: -100%;
background-color: #081e32;
transition: .2s;
}
.btn-gold:hover,
.btn-blue:hover{
color: #fff !important;
}
.btn-gold:hover::before,
.btn-blue:hover::before{
left: 0;
}
.side-nav p{
text-align: center;
font-weight: 500;
color: #646464;
line-height: 100px;
position: absolute;
top: 50%;
right: 1%;
transform: translate(0%, -50%) rotate(-90deg);;
-webkit-transform: translate(0%, -50%) rotate(-90deg);;
-ms-transform: translate(0%, -50%) rotate(-90deg);;
}
.side-nav p span{
position:relative;
}
.side-nav p span::before{
content: "";
display: inline-block;
width: 50px;
height: 1px;
background-color: #646464;
position: absolute;
bottom: 20%;
left: -60px;
}
.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-point00{
position: absolute;
bottom: 33px;
left: calc(50% - 7px);
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
z-index: 99;
}
.scroll-point00 div{
position: absolute;
top: 4px;
left: 50%;
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
background-color: #FFF;
animation-name: point-anime00;
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-anime00{
0%{top: 4px;}
50%{top: 20px;}
70%{top: 20px;}
80%{top: 20px;opacity: 0;}
90%{top: 4px;opacity: 0;}
100%{top: 4px;opacity: 1;}
}
.scroll-point00 div::after{
border-color: #fff;
width: 50px;
height: 50px;
} .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;
}
@keyframes point-anime01{
0%{height: 4px;}
70%{height: 130px;}
80%{height: 130px;opacity: 0;}
90%{height: 4px;opacity: 0;}
100%{height: 4px;opacity: 1;}
} .scroll-point02{
position: absolute;
bottom: 50px;
left: calc(50% - 7px);
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
z-index: 99;
}
.scroll-point02:before{
content: 'Scroll';
font-size: 10px;
position: absolute;
top: 0;
left: 50%;
color: #fff;
}
.scroll-point02 div{
position: absolute;
top: 20px;
left: calc(50% + 14px);
width: 1px;
height: 30px;
background-color: #fff;
animation-name: point-anime02;
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-anime02{
0%{height: 4px;}
70%{height: 30px;}
80%{height: 30px;opacity: 0;}
90%{height: 4px;opacity: 0;}
100%{height: 4px;opacity: 1;}
} .youtube{
position: absolute;
bottom: 2%;
right: 1.25%;
z-index: 100;
} .inner{
max-width: 960px;
margin: 0 auto;
}
.inner2{
max-width: 1290px;
margin: 0 auto;
}
.inner3{
max-width: 1120px;
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;
}
.left48p{
width: 48%;
}
.left50p{
width: 50%;
}
.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);
}
.right48p{
width: 48%;
}
.right50p{
width: 50%;
}
@media screen and (max-width: 767px) {
.left00{
width: 100%;
margin: 0;
padding: 0;
}
.left01{
width: calc(100% - 240px);
}
.left02{
width: calc(100% - 400px);
}
.left03{
width: 200px;
margin-right: 40px;
}
.left04{
width: 140px;
margin-right: 20px;
}
.right00{
width: 100%;
margin: 0;
}
.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;
}
.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;
}
.iflex{
display: inline-flex !important;
}
.flex-start {
justify-content: flex-start !important;
}
.flex-end {
justify-content: flex-end !important;
}
.space-between {
justify-content: space-between !important;
}
.space-around {
justify-content: space-around !important;
}
.fd-initial {
flex-direction: initial !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.tri.normal .box{width: calc((100% - 2px) / 3);margin-bottom:1px;padding: 0 10px;}
.flex.tetra .box{width: 24.083333%;}
.flex.tetra.narrow .box{width: calc((100% - 3px) / 4);margin-bottom:1px;}
.flex.penta .box{width: 19.083333%;}
.flex.penta.narrow .box{width: calc((100% - 4px) / 5);margin-bottom:1px;}
.box-wrapper {
position: relative;
width: 100%;
height: auto;
}
.box-wrapper:before {
content:"";
display: block;
padding-top: 100%; }
.box-wrapper > * {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.nobr br{display:none;}
.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;
}
.static{position: static;}
.relative{position: relative;}
.abs, .absolute{position: absolute;}
.fixed{position: fixed;}
.center-abs{
position: absolute;
top: 50%;
left: 50%;
right: auto !important;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
z-index: 100;
height: min-content;
}
.center-abs2{
position: absolute;
left: 50%;
right: auto !important;
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
z-index: 100;
}
.vmiddle-abs{
position: absolute;
top: 50%;
transform: translate(0%, -50%);
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
z-index: 100;
}
.top-abs{
position: absolute;
top: 0;
}
.bottom-abs{
position: absolute;
bottom: 0;
}
.left-abs{
position: absolute;
left: 0;
}
.right-abs{
position: absolute;
right: 0;
}
.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}
} .zoomup{
display: block;
margin: 0 auto;
overflow: hidden;
cursor: pointer; 
}
.zoomup img{
width: 100%;
transition-duration: 0.5s;
transition: unset;
}
.zoomup:hover img{
transform: scale(1.2);
transition-duration: 0.5s;
}
a:hover.zoomup{
opacity: 0.8;
} a.hover-txt01{
transition: .3s;
}
a:hover.hover-txt01{
letter-spacing: .3rem;
} .hover-bound:hover{
animation: hboundaction .3s ease infinite alternate;
}
@keyframes hboundaction {
0% {transform: translateY(0px);}
100% {transform: translateY(-10px);}
} a.hover-roundbox {
position: relative;
display: block;
padding-bottom: 20px;
}
a.hover-roundbox::after {
content: '';
background: transparent;
border-radius: 100%;
display: block;
height: 0;
left: 50%;
position: absolute;
bottom: 0px;
-webkit-transition: width 0.5s, height 0.5s;
transition: width 0.5s, height 0.5s;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
width: 0;
}
a.hover-roundbox:hover::after {
border: solid 1px #000;
height: 100px;
width: 100px;
bottom: 0;
} .hover-push a {
position: absolute;
z-index: 1;
color: #000;
box-sizing: border-box;
border: 1px solid #000;
transition: all 0.1s ease;
-webkit-transition: all 0.1s ease;
overflow: visible;
background: none;
}
.hover-push a:before {
content: "";
width: 200px;
height: 1px;
position: absolute;
border-bottom: 1px solid #000;
bottom: -10px;
left: 8px;
transition: all 0.1s ease;
-webkit-transition: all 0.1s ease;
}
.hover-push a:after {
content: "";
width: 1px;
height: 100px;
position: absolute;
border-right: 1px solid #000;
bottom: -10px;
right: -10px;
transition: all 0.1s ease;
-webkit-transition: all 0.1s ease;
}
.hover-push a:hover {
margin: 6px 0 0 6px;
}
.hover-push a:hover:before {
bottom: -1px;
left: -1px;
}
.hover-push a:hover:after {
bottom: -1px;
right: -1px;
} .hover-lineextend a:hover:before,
.hover-lineextend a:hover:after {
width: 100%;
}
.hover-lineextend a:hover .line:before,
.hover-lineextend a:hover .line:after {
height: 100%;
}
.hover-lineextend a:before {
background-color: #97ca65;
content: "";
display: block;
position: absolute;
z-index: 10;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
bottom: 0;
height: 10px;
right: 0;
width: 0;
}
.hover-lineextend a:after {
background-color: #97ca65;
content: "";
display: block;
position: absolute;
z-index: 10;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
height: 10px;
left: 0;
top: 0;
width: 0;
}
.hover-lineextend a .line:before {
background-color: #97ca65;
content: "";
display: block;
position: absolute;
z-index: 10;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
height: 0;
right: 0;
top: 0;
width: 10px;
}
.hover-lineextend a .line:after {
background-color: #97ca65;
content: "";
display: block;
position: absolute;
z-index: 10;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
bottom: 0;
height: 0;
left: 0;
width: 10px;
} .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; } @media screen and (max-width: 575px) {
.parallax {
background-attachment: unset;
}
.parallax::before {
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
-webkit-transform: translate3d(0, 0, -1px);
transform: translate3d(0, 0, -1px);
width: 100%;
min-height: 100%;
-webkit-background-size: cover;
background-size: cover;
z-index: -1;
}
} .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;
}
.section {
padding: 0;
}
pre{
font-family: inherit;
margin: 0;
}
pre[data-name=preCode] {
padding: 36px;
margin-top: 36px;
margin-bottom: 36px;
font-family: note monospace,SFMono-Regular,Consolas,Menlo,Courier,monospace;
line-height: 18px;
color: #fff;
white-space: pre-wrap;
background-color: #282c34;
font-size: 12px;
} .pc { display: block !important; }
.sp { display: none !important; }  @media screen and (max-width: 1199px) {
.inner2{width: 95%;}
.inner3{width: 95%;}
.left02{
width: calc(100% - 240px);
}
.right02{
width: 200px;
margin-left: 40px;
}    
}  @media screen and (max-width: 959px) { main{padding-bottom: 0px;}
.inner, .inner2, .inner3{width: 85%;}
.inner .inner{width: 100%;}
.spbr{display: block;}
.spbr br{display: none;}
.pc { display: none !important; }
.sp { display: block !important; }
.left01, .left02, .left03, .left04, .left05{
width: 100%;
}
.right01, .right02, .right03, .right04, .right05{
width: 100%;
margin-left: 0;
}
.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.tri.normal .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%;}
.flex.penta{display: flex;}
.flex.penta .box{width: 32.083333%;}
.flex.penta.narrow .box{width: calc((100% - 4px) / 3);margin-bottom:1px;}
.sp-block {
display: block !important;
}
.sp-iblock {
display: inline-block !important;
}
.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.tri.normal .box{width: calc((100% - 2px) / 3);margin-bottom:1px;padding:0 10px;}
.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;}
.sp-flex.penta .box{width: 19.083333%;}
.sp-flex.penta.narrow .box{width: calc((100% - 4px) / 5);margin-bottom:1px;}
}
  section{overflow: hidden;margin-top: 100px;}
nav {
color: #3C3C3C;
background-color: #fff;
width: 100%;
height: auto;
line-height: 1.75;
box-shadow: none;
}
nav ul li {
float: none;
}
nav ul li a {
-webkit-transition: background-color .3s;
transition: background-color .3s;
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;
text-align: center;
background-color: #828282;
}
.fmtBtn03 a{
display: flex;
justify-content: center;
align-items: center;
width: 160px;
height: 40px;
margin: 0 auto;
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(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/images/common/contact_icon.svg);
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: center left;
} .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;}
.box.titleList03{width: 100%;min-height: auto;margin-bottom: 100px;}
.box.titleList04{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;
justify-content: flex-start;
align-items: center;
}
.titleList dt{width: 11em;}
.titleList03 li{height: auto;}
.box.titleList03 li{height: auto;border:none;}
.titleList03 dl{padding: 0;height: auto;}
.titleList03 dl > *{height: 80px;line-height: 80px;}
.titleList03 dt {background-color: #000; color: #fff; border: solid 1px; border-color: #000 #000 #fff #000; box-sizing: border-box;}
.titleList03 dd {width: calc(100% - 11em); border: solid 1px; border-color: #000 #000 transparent transparent;box-sizing: border-box;padding-left: 50px;}
.titleList03 li:last-child dt{border-bottom: solid 1px #000;}
.titleList03 li:last-child dd{border-bottom: solid 1px #000;}
.box.titleList04 li{height: 6em;}
.box.titleList04 li.long{height: auto;}
.titleList04 dd {width: calc(100% - 11em); padding-left: 50px; position: relative;}
.titleList04 dd::before {content: ''; width: 1px; height: 6em; border: solid 1px; border-left-color: #000; box-sizing: border-box; position: absolute; top: -30px; left: 0;}
.box.titleList + .image{width: 360px;height: 320px;}
.box.titleList02 + .image{width: 100%;height: 320px;}
.box.titleList04 + .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) {   .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) {  .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 dl{
display: block;
height: auto;
padding: 2em 0;
}
.titleList dt{width: 100%;margin-bottom: 0.3em;}
.titleList03 dl{padding: 0;height: auto;}
.titleList03 dl > *{height: auto;line-height: 1.75;}
.titleList03 dt {margin:0;border:none;padding: 20px 5%;}
.titleList03 dd {
border-color: #000;
width: 100%;
margin-top: 0;
margin-bottom: 40px;
padding: 20px 5%;
}
.titleList04 dd::before {
display: none;
}
.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-4{
position: relative;
}
.head-1-4 .logo{
width: 80%;
max-width: 200px;
max-height: 200px;
margin: 0 auto;
display: inline-block;
}
.head-1-4 .logo .small{
max-width: 40px;
max-height: 40px;
display: none;
}
nav{
color: #000 !important;
}
#globalNavi.bg-white .logo .big{
display: none;
}
#globalNavi.bg-black .logo .big{
display: none;
}
#globalNavi.bg-white .logo .small{
display: block;
}
#globalNavi.bg-black .logo .small{
display: block;
}
.linkBtn{
top: 0px;
right: 0px;
}
.linkBtn01 a{
border: 1px solid #000;
background-color: #000;
color: #fff !important;
display: inline-block;
width: 120px;
height: 120px;
text-align: center;
line-height: 120px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all  0.3s ease;
}
.linkBtn01 a:hover{
border: 1px solid #000;
background-color: #fff;
color: #000 !important;
opacity: 1;
}
.head-1-4 .key{
position: relative;
min-height: 500px;
max-height: 500px;
background-size: cover;
background-repeat: no-repeat;
background-position: center left;
}
#top .head-1-4 .key {
height: 100vh;
min-height: 700px;
position: relative;
background-image: none;
min-height: auto;
max-height: 100vh;
overflow: hidden;
}
#news .head-1-4 .key,
#faq .head-1-4 .key,
#contact .head-1-4 .key,
#sitemap .head-1-4 .key {
min-height: 350px;
max-height: 350px;
}
.head-1-4 .key::before{
content: "";
display: block;
width: 0;
padding-top: 59.765625%;
}
#news .head-1-4 .key::before,
#faq .head-1-4 .key::before,
#contact .head-1-4 .key::before,
#sitemap .head-1-4 .key::before {
display: none;
}
#top .head-1-4 .key::before{
display: none;
}
#top .head-1-4 .key div.mv-swiper-container,
#top .head-1-4 .key div.swiper-wrapper,
#top .head-1-4 .key div.swiper-slide {
height: 100vh;
min-height: 700px;
}
#top .head-1-4 .key div.swiper-slide img {
height: 100vh;
min-height: 700px;
width: 100%;
object-fit: cover;
object-position: center;
}
.head-1-4 .pageTitle{
width: 100%;
text-align: center;
position: absolute;
top: 270px;
left: 50%;
right: auto !important;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
z-index: 100;
line-height: 1.0;
}
#top .head-1-4 .pageTitle{
top: auto;
bottom: 10vh;
}
.head-1-4 .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-4 .pageTitle .s-title{
display: block;
margin-top: 0.4em;
font-size: 48px;
line-height: 1.75;
letter-spacing: 0.1em;
}
.head-1-4 .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));
}
#news .head-1-4 .pageTitle > *,
#faq .head-1-4 .pageTitle > *,
#contact .head-1-4 .pageTitle > *,
#sitemap .head-1-4 .pageTitle > * {
filter: initial;
}
.head-1-4 .pageTitle .title span{font-weight: 100;}
.head-1-4 .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-4 .pageTitle + .catch span{display: block;}
.head-1-4 .pageTitle + .catch span + span{text-align: right;}
#globalNavi{
position: fixed;
top: 0;
left: 0;
z-index: 9000;
width: 100%;
height: auto;
background-color: transparent;
color: #3C3C3C;
line-height: 1.6;
}
#globalNavi .inner{
position: relative;
width: 100%;
max-width: 100%;
height: 120px;
padding: 0;
}
#globalNavi .navTitle{
font-size: 18px;
font-weight: normal;
margin-bottom: 0;
margin-top: 50px;
margin-left: 50px;
}
#globalNavi .navTitle span{font-weight: 100;}
#globalNavi .bottom{position: absolute;bottom: 30px;}
#globalNavi .inner nav{
background-color: transparent;
width: calc(100% - 300px);
height: 100%;
}
.navigation-container {
height:100%;
margin-right: 50px;
}
.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: 30px;
width: max-content;
}
.navigation-container ul li:first-of-type{
margin-left: 0;
}
.navigation-container ul li a{
position: relative;
text-align: center;
overflow: hidden;
padding: 0;
}
.navigation-container ul li a::after {
position: absolute;
bottom: 0;
left: 0;
display: block;
content: "";
width: 0%;
height: 1px;
background: #000;
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%;margin-right: 50px;}
.snsList li{width: 30px;height: 30px;}
.snsList li + li{margin-left: 8px;}
.snsList li a{display: block;padding: 0;}
.snsList li a img{min-width: 30px;}
.copy{margin-top: 20px;font-size: 10px;font-weight: 100;}
#globalNavi .fmtBtn{
position: absolute;
top: 50%;
right: 100px;
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: 14px;
height: 10px;
position: absolute;
left: 25px;
background-image: url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/images/common/contact_icon.svg);
background-size: 14px 10px;
background-repeat: no-repeat;
background-position: center left;
}
#globalNavi.bg-white .fmtBtn01 a::before{
background-image: url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/images/common/contact_icon_bk.svg);
}
#globalNavi.bg-black .fmtBtn01 a::before{
background-image: url(//fields-dental.com/wp/wp-content/themes/design-hp_format_2020/library/images/common/contact_icon.svg);
}
#globalNavi.bg-transparent .wh{
display: none;
}
#globalNavi.bg-transparent .bk{
display: block;
}
#globalNavi.bg-white .wh{
display: none;
}
#globalNavi.bg-white .bk{
display: block;
}
#globalNavi.bg-black .wh{
display: block;
}
#globalNavi.bg-black .bk{
display: none;
} @media screen and (max-height: 670px) {} @media screen and (max-width: 1360px) {
.navigation-container ul li:last-of-type {
display: none;
}
#globalNavi .inner nav {
width: calc(100% - 300px);;
}
} @media screen and (max-width: 1260px) {
.navigation-container ul li.news {
display: none;
}
#globalNavi .inner nav {
width: calc(100% - 300px);
}
} @media screen and (max-width: 1119px) { .head-1-4 .pageTitle .catch{font-size: 22px;}
.head-1-4 .pageTitle .title{font-size: 45px;}
.head-1-4 .pageTitle + .catch{font-size: 90px;}
}  @media screen and (max-width: 959px) { .type-head-1-4 main,
.type-head-1-4 #pageHeader{padding-left: 0;} .head-1-4{}
.head-1-4 .key{
min-height: 0;
max-height: none;
max-height: 300px;
background-size: cover;
background-position: center center;
}
#top .head-1-4 .key {
height: auto;
}
#news .head-1-4 .key,
#faq .head-1-4 .key,
#contact .head-1-4 .key,
#sitemap .head-1-4 .key {
min-height: 250px;
max-height: 250px;
margin-bottom: -75px;
}
.head-1-4 .key::before{padding-top: 178%;}
.head-1-4 .pageTitle{
width: 100%;
text-align: center;
position: absolute;
top: 65%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
.head-1-4 .pageTitle .catch{font-size: 16px;}
.head-1-4 .pageTitle .title{font-size: 34px;}
.head-1-4 .pageTitle + .catch{
bottom: 30px;
right: auto;
left: 11%;
font-size: 65px;
}
.head-1-4 .pageTitle .s-title{
margin-top: 0;
font-size: 28px;
}
#globalNavi{
position: absolute;
}
#globalNavi .inner{
background: #fff;
opacity: 1;
height: 100px;
position: relative;
}
#globalNavi .navTitle{
width: 140px;
margin: 10px auto;
}
}  @media screen and (max-width: 767px) {
#globalNavi .navTitle{
margin: 0px auto;
}
}  @media screen and (max-width: 479px) { .head-1-4 .pageTitle + .catch{font-size: 22vw;}
} @media screen and (min-width: 1160px) and (max-width: 1350px) {
#globalNavi .inner nav {
width: calc(100% - 300px);
}
.navigation-container ul .npnone { display: none;
}
#globalNavi .navTitle {
width: auto;
height: auto;
padding: 0;
background-color: transparent !important;
transition: all 0.2s;
}
#globalNavi .navTitle span {
margin-bottom: 0.75em;
display: block;
position: absolute;
bottom: 5px;
}
#globalNavi .navTitle span br {
display: none;
}
#globalNavi .navTitle span:after {
display: none;
}
#globalNavi .navTitle a img {
max-width: 230px;
margin: 0;
position: relative;
top: 0.3em;
}
}.foot-6 .navigation-container ul li:last-of-type{
display: block;
}
.foot-6 .navigation-container ul li:nth-last-of-type(2){
display: block;
}
.foot-6{
padding: 0;
}
#inner-footer {
position: relative;
}
#inner-footer nav {
background-color: transparent;
}
.footer-nav{
}
.footer-nav ul{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.footer-nav ul li{
}
#pageFooter .navigation-container{
margin-right: 0;
}
.foot-6 .info_address {
margin-bottom: 1em;
}
.foot-6 .info_tel { }
.foot-6 .info_tel span {
margin-right: 5px;
}
.foot-6 .snsList {
justify-content: flex-end;
}
#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: 0;
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: 0;
}
#pageFooter .navigation-container ul li a span.jp {
text-align: center;
} @media screen and (max-width: 1279px) {}  @media screen and (max-width: 959px) { .foot-6{display: block;text-align: center;padding: 0;}
.foot-6 .inner{padding-bottom: 30px;}
.foot-6 .infoList dt{margin-bottom: 20px;}
.foot-6 .infoList dd{margin-top: 0;}
.foot-6 .snsList{display: flex;justify-content: center;}
.foot-6 .fmtBtn{position: relative;}
.foot-6 .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-6 .fmtBtn .totop{
position: absolute;
top: 0;
right: 0;
width: 60px;
height: 60px;
background-color: #000;
}
.foot-6 .fmtBtn .totop a{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.foot-6 .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 {
}
.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) {}
  .menu-item-has-children {
position: relative;
}
.navigation-container_has-child .menu-item-has-children > a{ cursor: default;
text-decoration:none;
} .menu-item-has-children:hover {
cursor: pointer;
}
.menu-item-has-children:hover a{
opacity: 0.5;
} .sub-menu {
display: none !important;
position: absolute;
top: 100%;
left: 0;
width: 100px;
padding: 0;
}
#sp_global_navi .sub-menu {
display: block !important;
position: static;
} .menu-item-has-children:hover .sub-menu {
display: block !important;
background: #fff;
width: 175px;
}
#sp_global_navi .menu-item-has-children .sub-menu {
background: transparent;
margin-top: 0px;
}
.menu-item-has-children:hover .sub-menu a {
text-align: left;
text-indent: 15px;
}
.sub-menu > .menu-item:before {
content: '-';
display: inline-block;
position: absolute;
left: 0.5em;
padding: .5em 0; }
#sp_global_navi .sub-menu > .menu-item {
position: relative;
width: 120px;
padding-left: 30px;
}
#sp_global_navi .sub-menu > .menu-item:before {
content: '-';
display: inline-block;
position: absolute;
top: 50%;
left: 40px;
transform: translate(0%, -50%);
}
.footer-nav .menu-item-has-children:hover .sub-menu {
top: -130px;
margin-top: 0px;
}
.footer-nav .sub-menu > .menu-item:before {
left: 5px;
} .sub-menu > .menu-item a {
display: inline-block;
width: 100%;
height: 100%;
padding: .5em 0;
} .sub-menu > .menu-item a:hover {
opacity: 0.9;
}
.sub-menu > .menu-item a::after {
background-color: none !important;
} .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;
position: absolute;
left: -5px;
}
.secFlow-1 .inner .flowList-1 li h3.heading {
font-size: 24px;
line-height: 1.5em;
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;
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);
} .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;
}
.secContact .tel {
margin-top: 30px;
text-align: center;
}
.secContact .tel a {
}
.secContact .tel p {
text-align: center;
}
.secContact .download,
.secContact .submit {
text-align: center;
display: block;
margin: 40px auto 100px;
max-width: 320px;
height: 50px;
}
.secContact.bb .download,
.secContact.bb .submit {
color: #fff;
}
.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.bb .search {
color: #fff;
}
.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-2 div.contactForm dt span::before {
content: '*';
margin-left: 2px;
top: -2px;
position: relative;
}
.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 {
margin-bottom: 1.5em;
}
.secContact div.contactForm dl#privacy dd p label {
color: #fff;
}
.secContact.bb div.contactForm dd span input,
.secContact.bb div.contactForm dd span textarea,
.secContact.bb div.contactForm dd span select {
border: solid 1px #000;
}
.secContact.bb div.contactForm dl#privacy dd div.pp {
border: solid 1px #000;
}
.secContact div.contactForm dd span input.wpcf7c-conf,
.secContact div.contactForm dd span textarea.wpcf7c-conf,
.secContact div.contactForm dd span select.wpcf7c-conf {
border-color: transparent;
}
.secContact.bb div.contactForm dl#privacy dd p label {
color: inherit;
}
.secContact.bb [type="checkbox"]+span:not(.lever):before,
.secContact.bb [type="checkbox"]:not(.filled-in)+span:not(.lever):after {
border-color: #5a5a5a;
}
.secContact.bb [type="checkbox"]:checked+span:not(.lever):before {
border-color: transparent;
border-right-color: #5a5a5a;
border-bottom-color: #5a5a5a;
} .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{
margin-bottom: 0.75em;
}
.secA-1 .secTitle-1-1{
font-size: 40px;
font-weight: 500;
margin-bottom: 0.7em;
text-align: center;
}
.secA-1 .lead{
} .secB-1{}
.secB-1 figure{width: 62.5%;}
.secB-1 .box{width: 35%;}
.secB-1 .secTitle-2{
margin-bottom: 1.25em;
}
.secB-1 .secTitle-2 + .txt{
margin-bottom: 60px;
}
.secB-1 .secTitle-3{
margin-bottom: 1.5em;
}
.secB-1 .secTitle-3 + .txt{
margin-bottom: 55px;
}
.secB-1 .secTitle-3 + .txt:last-child{
margin-bottom: 15px;
}
.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: 360px;
height: 100%;
padding-right: 40px;
text-align: left;
}
.secB-1.responsive .box .wrap{
width: 100%;
} .secB-2{}
.secB-2 .flex {
flex-direction: row-reverse;
}
.secB-2 figure{width: 62.5%;float:right;}
.secB-2 .box{width: 35%;float:left;}
.secB-2 .secTitle-2{
margin-bottom: 1.5em;
}
.secB-2 .secTitle-2 + .txt{
margin-bottom: 55px;
}
.secB-2 .secTitle-3{
margin-bottom: 1.5em;
}
.secB-2 .secTitle-3 + .txt{
margin-bottom: 55px;
}
.secB-2 .secTitle-3 + .txt:last-child{
margin-bottom: 15px;
}
.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: 380px;
height: 100%;
padding-left: 40px;
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 .txt{
max-width: 460px;
text-align: justify;
}
.secB-8_2 .secTitle-3{
}
.secB-8_2 .secTitle-4{
}
.secB-8_2 .txt{
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{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 .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 .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{ }
.secC-5 .itemList-1 .discription p{
margin-top: 30px; } .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;background: #3C3C3C;padding: 5px 10px;display: table;}
.secE-2 .itemList-1 .heading{font-size: 24px;text-align: left;}
.secE-2 .itemList-1 .date{position: absolute;top: 0;left: 0;}
.secE-2 .itemList-1 .txt{margin-top: 10px;text-align: left;}
.secE-2 ul:not(.browser-default) {
padding: 40px 0 20px 35px;
}
.secE-2 .bgSquare-1::before {
top: 0;
left: 0;
height: 100%;
} .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.normal {
padding: 25px;
}
.secE-3 .itemList-1 .box.narrow {
padding: 10px;
}
.secE-3 .itemList-1 .box .image{
width: 100%;
max-width: 160px;
height: 160px;
margin-right: 40px;
overflow: hidden;
}
.secE-3 .itemList-1.flex.di .box .image{
margin-right: 0;
margin-bottom: 20px;
}
.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;
background: #3C3C3C;
padding: 5px 10px;
}
.secE-3 .itemList-1 .category-white{
background: transparent;
border: solid 1px #000;
}
.secE-3 .itemList-1 .date{
margin-left: 10px;
display: inline-block;
}
.secE-3 .itemList-1 .heading{text-align: left;margin-top: 0.5em;font-weight: normal;}
.secE-3 .itemList-1 .txt{margin: 10px 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 {
margin-bottom: 1em;
}
.secE-4 .itemList-1 .box .secTitle-3 > span{
display: block;
margin-top: 0.5em;
}
.secE-4 .itemList-1 .category{
min-width: 120px;
text-align: center;
display: inline-block;
background: #3C3C3C;
padding: 5px 10px;
}
.secE-4 .itemList-1 .date{
margin-left: 10px;
display: inline-block;
}
.secE-4 .itemList-1 .heading{text-align: left;margin-top: 0.5em;}
.secE-4 .itemList-1 .txt{margin: 10px 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{margin-bottom: 0.5em;}
.secG-2 .lead{text-align: left;} .secG-3{
position: relative;
overflow: visible;
}
.secG-3 .inner {
border: solid 1px;
padding: 60px;
}
.secG-3 .inner:before {
content: "";
background-color: #fff;
width: 7em;
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.wide .inner:before {
width: 30em;
}
.secG-3.bg-gray08 .inner:before {
background-color: #eaeae9;
}
.secG-3 .row .col.gap:first-child .overtext {
left: 1rem;
}
.secG-3 .row .col.gap:last-child .overtext {
left: 2rem;
}
.secG-3 .overtext span {
}
.secG-3 .link-box .txt {
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: "ランドリーグッズ／雑貨";
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;
}
.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{}
.secC-4 .itemList-1 .heading .img{max-width: 120px;}
.secC-4 .itemList-1 .txt{} .secE-2 .itemList-1 .heading{}
.secE-2 .itemList-1 .heading .img{max-width: 120px;}
.secE-2 .itemList-1 .txt{} .secE-3 .itemList-1 .heading{}
.secE-3 .itemList-1 .heading .img{max-width: 120px;}
.secE-3 .itemList-1 .txt{} .secE-4 .itemList-1 .heading{}
.secE-4 .itemList-1 .heading .img{max-width: 120px;}
.secE-4 .itemList-1 .txt{} .secG-2 .secTitle-3{}
.secG-2 .lead{}
}  @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{
} .secB-1 figure{width: 100%;}
.secB-1 .box{width: 100%;margin-top: 1em;align-items: flex-start;}
.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: 20px auto 10px;
}
.secB-1 .secTitle-2 {
margin-bottom: 20px;
}
.secB-1 .secTitle-2 + .txt {
margin-bottom: 30px;
}
.secB-1 .secTitle-3 {
margin-bottom: 15px;
}
.secB-1 .secTitle-3 + .txt,
.secB-1 .secTitle-3 + .txt:last-child {
margin-bottom: 0px;
}
.secB-1 .more-btn {
text-align: right;
} .secB-2 figure{width: 100%;}
.secB-2 .box{width: 100%;margin-top: 1em;align-items: flex-start;}
.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: 20px auto 10px;
}
.secB-2 .secTitle-3 {
margin-bottom: 15px;
}
.secB-2 .secTitle-3 + .txt,
.secB-2 .secTitle-3 + .txt:last-child {
margin-bottom: 0px;
}
.secB-2 .more-btn {
text-align: right;
} .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{}
.secC-4 .itemList-1 .heading .img{max-width: 167px;}
.secC-4 .itemList-1 .txt{}
.secC-4 .itemList-1 li + li{margin-top: 10px;} .secE-2 .itemList-1 .heading{}
.secE-2 .itemList-1 .heading .img{max-width: 167px;}
.secE-2 .itemList-1 .txt{}
.secE-2 .itemList-1 li + li{margin-top: 10px;} .secE-3 .itemList-1 .heading{}
.secE-3 .itemList-1 .heading .img{max-width: 167px;}
.secE-3 .itemList-1 .txt{}
.secE-3 .itemList-1 li + li{margin-top: 10px;}
.secE-3 .itemList-1{
padding-bottom: 20px;
}
.secE-3 .itemList-1 .box{
padding: 30px;
margin-bottom: 20px;
}
.secE-3 .itemList-1 .box.normal {
padding: 10px;
}
.secE-3 .itemList-1 .box.narrow {
padding: 10px;
}
.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{ }
.secE-3 .itemList-1 .heading{
}
.secE-3 .itemList-1 .txt{
text-align: justify;
margin-bottom: 10px;
}
.secE-3 .itemList-1 .box .image{
max-width: 100%;
max-height: 160px;
margin-right: 0;
margin-bottom: 20px;
} .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: 20px;
}  .secG-2 .secTitle-3{}
.secG-2 .lead{} .secG-3 .inner {
padding: 10% 5%;
}
.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-3.wide .inner:before {
width: 18em;
} .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-3-3{
position: relative;
}
.secNews-3-3{
padding-top: 70px;
padding-bottom: 70px;
}
.secNews-3-3 .btn02 a{
margin: 0 auto;
}
.secNews-3-3 .itemList-1 .box{
margin-bottom: 30px;
}
.secNews-3-3 .itemList-1 .category{    
min-width: 100px;
text-align: center;
display: inline-block;
font-size: 12px;
line-height: 1;
border: 1px solid #000;
color: #000;
padding: 5px 10px;
margin-bottom: 10px;
}
.secNews-3-3 .category a,
.secNews-3-3 .category a:visited{
color: #000;
}
.secNews-3-3 .itemList-1 .date{font-size: 12px;} @media screen and (max-width: 1279px) {
}  @media screen and (max-width: 1119px) { }  @media screen and (max-width: 959px) { .secNews-3-3 .itemList-1 .box {
padding: 0;
margin-bottom: 30px;
}
.secNews-3-3{
padding-top: 50px;
padding-bottom: 50px;
}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 600px) {}  @media screen and (max-width: 479px) {}

#instagram.secInsta {
padding: 80px 0 80px;
}
#instagram.secInsta-2 {
padding: 50px 0 80px;
}
.secInsta header {
width: auto;
margin: 0 auto;
}
.secInsta header h4 {
color: #000;
text-align: center;
letter-spacing: 0.01em !important;
display: inline-block;
top: 3px;
position: relative;
}
.secInsta header a {
margin: auto;
display: block;
}
.secInsta header a img {
width: 100%;
max-width: 35px;
height: auto;
display: inline-block;
}
.secInsta-2 header {
margin-bottom: 30px;
}
.secInsta-2 .box {
width: 100%;
}
.secInsta-2 .box a {
width: 300px;
height: 300px;
}
.secInsta-2 .box a:nth-of-type(n+4) {
margin-top: 30px;
}
.secInsta-2 .box a img {
width: 100%;
height: 100%;
object-fit: cover;
} @media screen and (max-width: 1119px) {
.secInsta-2 .box a{
width: 32%;
height: 32%;
}
}  @media screen and (max-width: 959px) {
.secInsta {
padding: 0;
}
.secInsta .inner {
align-items: flex-start;
}
.secInsta header {
width: 100%;
position: relative;
margin-bottom: 20px;
}
.secInsta header h4 {
text-align: center;
padding-left: 0;
margin-bottom: 0;
padding: 0 0 10px;
font-size: 20px;
}
.secInsta header a {
}
.secInsta header a img {
width: 100%;
height: auto;
}
.secInsta-2 .box {
width: 100%;
display: flex;
}
.secInsta-2 .box a {
width: 32%;
height: 32%;
display: block;
}
.secInsta-2 .box a:nth-of-type(n+4) {
margin-top: 1.5%;
}
.secInsta-2 .box a:nth-of-type(10) {
display: none;
}   
#instagram.secInsta-2{
padding: 40px 0 40px;
}
}  @media screen and (max-width: 767px) {}  @media screen and (max-width: 479px) {}

.single img{
width: auto;
max-width: 100%;
}
.single .secColumn-2 {
max-width: 600px;
}
.single .secColumn-2 > *{
font-weight: normal !important;
line-height: 1.75 !important;
letter-spacing: 0.05em !important;
}
.single .secColumn-2 h1 {
font-size: 21px !important;
margin-top: 10px;
margin-bottom: 45px;
}
.single .secColumn-2 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-2 h3 {
font-size: 16px !important;
font-weight: normal;
margin-top: 25px;
margin-bottom: 25px;
counter-increment: h3;
counter-reset: h4 h5 h6;
}
.single .secColumn-2 h2::before,
.single .secColumn-2 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-2 h2::before { }
.single .secColumn-2 h3::before { }
.single .secColumn-2 h4 {
font-size: 14px !important;
line-height: 1.75 !important;
margin-bottom: 0.25em !important;
}
.single .secColumn-2 h4.doton:before {
content: '・ ';
}
.single .secColumn-2 h4 + .txt {
margin-left: 0.75em;
}
.single .secColumn-2 .txt ul {
counter-reset:list;
list-style-type:none;
padding:0;
margin: 0 0 1.75em;
}
.single .secColumn-2 .txt ul li {
position:relative;
padding: 0 0 0 20px;
margin: 7px 0 7px 0px;
font-weight: bold;
line-height: 30px;
}
.single .secColumn-2 .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-2 .txt ol {
counter-reset:list;
list-style-type:none;
padding: 0;
}
.single .secColumn-2 .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-2 .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-2 .column-box {
border: solid 1px #646464;
background-color: #f5f5f5;
padding: 5% 10%;
margin-bottom: 1.75em;
}
.single .secColumn-2 .column-box > p,
.single .secColumn-2 .column-box > ul,
.single .secColumn-2 .column-box > ol{
margin-bottom: 0;
}
.single .secColumn-2 .column-box2 {
background-color: #f5f5f5;
border: none;
}
.single .secColumn-2 .txt p {
letter-spacing: 0.05em;
line-height: 1.75;
margin-bottom: 1.75em;
}
.single .secColumn-2 .txt p span.s1 {
}
.single .secColumn-2 .txt p span.s2 {
letter-spacing: 0.05em;
}
.single .secColumn-2 .txt p br{
line-height: initial;
}
.single .secColumn-2 .txt1,
.single .secColumn-2 .txt2,
.single .secColumn-2 .txt3,
.single .secColumn-2 .txt5 {
margin-bottom: 0px;
}
.single .secColumn-2 .txt4 p {
margin-bottom: 0.75em;
} .secColumn-2 .txt {
margin-bottom: 10px;
display: inline-block;
}
.secColumn-2 .txt p {
}
.secColumn-2 .itemList-1 .box{
margin-bottom: 30px;
}
.secColumn-2 .itemList-1 .box figure{
margin-bottom: 20px;
}
.secColumn-2 .itemList-1 .box .noImage{
padding: 60px;
}
.secColumn-2 .category {
min-width: 100px;
text-align: center;
display: inline-block;
font-size: 12px;
line-height: 1;
border: 1px solid #000;
color: #000;
padding: 5px 10px;
margin-bottom: 10px;
}
.secColumn-2 .category a,
.secColumn-2 .category a:visited {
color: #fff;
}
.secColumn-2 .date {
display: inline-block;
}
.secColumn-2 .btn02 a{
margin: 0 auto;
} .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;
}
.secNextList .inner .prev a, .secNextList .inner .next a{
color: #000;
}
.category-list h4, .archives-list h4{
margin-bottom: 1em;
}
#news .secSidebar-2 nav, .single-news .secSidebar-2 nav{
border-left: 1px solid #4b4b4b;
padding-left: 2em;
} @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;
overflow: visible;
}
.secGallery-1 .carousel li.slick-slide {
padding: 0 15px;
}
.secGallery-1 .slide-arrow,
.secGallery-1 .slide-arrow:before,
.secGallery-1 .slide-arrow:after{
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.secGallery-1 .slide-arrow{
position: absolute;
top: 50%;
transform: translate(0%, -50%);
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
}
.secGallery-1 .prev-arrow{
left: -30px;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 20px 40px 0;
}
.secGallery-1 .prev-arrow.border-white{
border-color: transparent #fff transparent transparent;
}
.secGallery-1 .prev-arrow.border-black{
border-color: transparent #646464 transparent transparent;
}
.secGallery-1 .prev-arrow.border-gray{
border-color: transparent #cecece transparent transparent;
}
.secGallery-1 .prev-arrow:after{
content: '';
left: 2px;
top: -40px;
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 20px 40px 0;
}
.secGallery-1 .prev-arrow.border-white:after{
border-color: transparent #646464 transparent transparent;
}
.secGallery-1 .prev-arrow.border-black:after{
border-color: transparent #fff transparent transparent;
}
.secGallery-1 .prev-arrow.border-gray:after{
border-color: transparent #fff transparent transparent;
}
.secGallery-1 .next-arrow{
right: -30px;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 0 40px 20px;
}
.secGallery-1 .next-arrow.border-white{
border-color: transparent transparent transparent #fff;
}
.secGallery-1 .next-arrow.border-black{
border-color: transparent transparent transparent #646464;
}
.secGallery-1 .next-arrow.border-gray{
border-color: transparent transparent transparent #cecece;
}
.secGallery-1 .next-arrow:after{
content: '';
right: 2px;
top: -40px;
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 40px 0 40px 20px;
}
.secGallery-1 .next-arrow.border-white:after{
border-color: transparent transparent transparent #646464;
}
.secGallery-1 .next-arrow.border-black:after{
border-color: transparent transparent transparent #fff;
}
.secGallery-1 .next-arrow.border-gray:after{
border-color: transparent transparent transparent #fff;
}
.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.tri .box{
width: calc(33.33% - 2px);
}
.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;
}
#slideFilterL, #slideFilterR {
position: absolute;
top: 0;
width: calc(200%/3 + 1px);
height: 100%;
max-height: 1000px;
opacity: 0.7;
filter: alpha(opacity=60);
-ms-filter: "alpha( opacity=60 )";
background: #fff;
z-index: 1;
}
#slideFilterL {
left: calc(-1px - 200%/3);
}
#slideFilterR {
right: calc(-1px - 200%/3);
}
#slideFilterL > div {
left: auto;
right: 30px;
}
#slideFilterR > div {
left: 30px;
right: auto;
}
.lity-image img {
object-fit: contain;
} @media screen and (max-width: 959px) { .secGallery-1 .carousel {
margin-bottom: 0px;
}
.secGallery-1 .carousel li.slick-slide {
padding: 0;
margin: 0 2px;
}
.secGallery-1 .carousel img {
width: 100%;
height: auto;
}
.secGallery-1 .carousel .prev-arrow{
left: -8%;
}
.secGallery-1 .carousel .next-arrow{
right: -8%;
}
} @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-2 {
}
.secFaq-2 .inner {
}
.secFaq-2 .linkList-1 {
width: 100%;
margin: 50px auto;
}
.secFaq-2 .linkList-1 li {
width: 32.5%;
height: auto;
}
.secFaq-2 .linkList-1 li a,
.secFaq-2 .linkList-1 li span{
width: 100%;
display: inline-block;
border: solid 1px #646464;
padding: 5px 10px;
text-align: left;
}
.secFaq-2 .linkList-1 li span.current{
background-color: #fff;
color: #3C3C3C;
}
.secFaq-2 .box + .box {
margin-top: 50px;
}
.secFaq-2 .box .faqList-1 { margin-bottom: 1.5em;    
}
.secFaq-2 .box .secTitle-3 {
font-size: 18px;
line-height: 1.75;
margin-bottom: 0.25em;
}
.secFaq-2 .box dl {
margin-bottom: 0;
}
.secFaq-2 .box dl dt {
padding: 1em;
border-top: 1px solid #000;
}
.secFaq-2 .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: #000;
border-radius: 15px;
position: absolute;
color: #fff;
border: 1px solid #000;
}
.secFaq-2 .box dl dt span {
margin-left: 60px;
padding-right: 50px;
line-height: 1.5em;
display: block;
position: relative;
}
.secFaq-2 .box dl dt span::before, .secFaq-2 .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-2 .box dl dt span::after {
transform: rotate(-90deg);
}
.secFaq-2 .box dl.active dt span::after {
transform: rotate(0deg);
}
.secFaq-2 .box dl dd {
padding: 0 1em 1em;
display: none;
}
.secFaq-2 .box dl:first-of-type dd {
display: block;
}
.secFaq-2 .box dl:last-of-type dd {
border-bottom: 1px solid #000;
}
.secFaq-2 .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: #fff;
border-radius: 15px;
position: absolute;
color: #000;
border: 1px solid #000;
}
.secFaq-2 .box dl dd span {
margin-left: 60px;
display: block;
line-height: 1.5em;
} @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-2 .linkList-1{
width: 100%;
}
.secFaq-2 .linkList-1 li{
width: 100%;
font-size: 14px;
margin-bottom: 10px;
}
.secFaq-2 .linkList-1 li:last-child{
margin-bottom: 0;
}
.secFaq-2 .box dl dt,
.secFaq-2 .box dl dd {
padding: 0.5em;
min-height: 45px;
}
.secFaq-2 .box dl dt:before,
.secFaq-2 .box dl dd:before {
margin-right: 10px;
}
.secFaq-2 .box dl dt span,
.secFaq-2 .box dl dd span {
margin-left: 40px;
}
.secFaq-2 .box dl dt span {
padding-right: 30px;
}
.secFaq-2 .box dl dt span::before,
.secFaq-2 .box dl dt span::after {
width: 15px;
right: 10px;
}
}

section:last-of-type.contactBtn-3-5 {
margin-bottom: 0 !important;
}
.contactBtn-3-5{
padding-top: 70px;
padding-bottom: 70px;
}
.contactBtn-3-5 .row .col {
padding: 0;
}
.contactBtn-3-5 .map {
width: 90%;
}
.contactBtn-3-5 div.row>h2 {
text-align: center;
}
.contactBtn-3-5 div.info_title_box {
margin-bottom: 0;
justify-content: space-between;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.contactBtn-3-5 div.info_title_box .secTitle-3 {
margin-top: 0;
margin-bottom: 0;
text-align: left;
}
.contactBtn-3-5 div.info_title_box p.info_title_rb {
font-size: 28px;
text-align: left;
}
.contactBtn-3-5 ul.snsList{
margin: 0;
}
.contactBtn-3-5 ul.snsList .wh{
display: none;
}
.contactBtn-3-5 ul.snsList .bk{
display: block;
}
.contactBtn-3-5 div.info_address_box {
}
.contactBtn-3-5 div.info_address_box p {
font-weight: 400;
margin-bottom: 0.5em;
}
.contactBtn-3-5 div.info_address_box p.info_address {
margin-bottom: 0;
}
.contactBtn-3-5 div.info_address_box p.info_tel {
font-size: 24px;
}
.contactBtn-3-5 div.info_address_box p.info_tel span {
margin-right: 5px;
}
.contactBtn-3-5 div.info_address_box p.info_near_access {
margin-bottom: 20px;
}
.contactBtn-3-5 div.opening_hours {
margin: 1em 0 1em;
}
.contactBtn-3-5 div.opening_hours dl {
padding: 0.1em 0 0;
margin: 0;
margin-bottom: 1em;
}
.contactBtn-3-5 div.opening_hours dl dt {
max-width: 180px;
padding-bottom: 3px;
min-width: 100px;
margin-bottom: 0.5em;
}
.contactBtn-3-5 div.opening_hours dl dd {
padding-bottom: 3px;
margin: 0;
}
.contactBtn-3-5 div.opening_hours dl dd span.weekday {
letter-spacing: 0.77em;
margin-right: -0.5em;
}
.contactBtn-3-5 div.opening_hours dl dd span.holiday {
letter-spacing: 0.04em;
margin-right: 0.2em;
}
.contactBtn-3-5 div.opening_hours dl dd span.close {
letter-spacing: 0.34em;
margin-right: -0.2em;
}
.contactBtn-3-5 div.contact_link {
}
.contactBtn-3-5 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-5 div.contact_link a:hover.btn_link {
background: #000;
color: #fff;
opacity: 1;
}
.contactBtn-3-5 tr{
border-bottom: 1px solid #000;
}
.contactBtn-3-5 th,
.contactBtn-3-5 td{
font-weight: normal;
text-align: right;
padding: 5px 0 5px 0;
width: 12.5%;
}
.contactBtn-3-5 td:first-of-type{
text-align: left;
} @media screen and (max-width: 1119px) {}  @media screen and (max-width: 959px) {
.contactBtn-3-5 {
margin-top: 3em;
}
.contactBtn-3-5 iframe {
max-width: 100%;
}
.contactBtn-3-5 div.contact_link a.btn_link {
display: block;
width: 100%;
padding: 0;
text-align: center;
height: 4em;
}
.contactBtn-3-5 div.info_title_box {
width: 100%;
margin: 0 auto 1em;
text-align: center;
}
.contactBtn-3-5 div.info_title_box h3.info_title {
padding-top: 0;
text-align: center;
}
.contactBtn-3-5 div.info_title_box p.info_title_rb {
text-align: center;
font-size: 20px !important;
}
.contactBtn-3-5 div.info_title_box img {
margin: 0.5em auto 1em;
}
.contactBtn-3-5 div.info_address_box p.info_address {
text-align: center;
}
.contactBtn-3-5 div.info_address_box p.info_tel {
width: 100%;
max-width: 100%;
margin: 0 auto 20px;
padding-bottom: 0 !important;
text-align: center;
}
.contactBtn-3-5 div.info_address_box p.info_near_access {
text-align: center;
margin-bottom: 20px;
}
.contactBtn-3-5 div.opening_hours {
display: table;
margin: 1em auto;
white-space: nowrap;
}
.contactBtn-3-5 div.opening_hours dl:last-child {
margin: 0;
}
.contactBtn-3-5 div.opening_hours dl dt {
text-align: center;
margin: 0 auto 0.5em;
}
.contactBtn-3-5 div.opening_hours dl dd {
max-width: 180px;
text-align: center;
margin: 0 auto;
}
.contactBtn-3-5{
padding-top: 50px;
padding-bottom: 0;
}
}  @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;
}
.secBanner-2 .inner ul li {
width: 50%;
}
.secBanner-2 .inner ul li img {
}
.secBanner-2 .inner ul li>div {
padding: 50px 30px;
}
.secBanner-2 .inner ul li a {
color: #000 !important;
}
.secBanner-2 .inner ul li a:hover {
opacity: 1;
}
.secBanner-2 .inner ul li a>span {
width: auto;
text-align: center;
}
.secBanner-2 .inner ul li .secTitle-3 {
text-align: center;
}
.secBanner-2 .inner ul li .secTitle-3 span {
font-size: 28px;
line-height: 1;
letter-spacing: 0.035em;
}
.secBanner-2 .inner ul li .secTitle-3 + p {
font-size: 14px;
line-height: 1.5;
letter-spacing: 0.01em;
margin-top: 20px;
}
.secExBanner-2 .inner .link-banner {
}
.secExBanner-2 .inner .link-banner a {
padding: 50px;
display: block;
}
.secExBanner-2 .inner .link-banner a:hover {
opacity: 1;
}
.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.01em;
}
.secExBanner-2 .inner .link-banner .secTitle-3 + p {
letter-spacing: 0.01em;
}
@media screen and (max-width: 767px){
.secBanner-2 .inner{
width: 90%;
margin-top: 20px;
}
.secBanner-2 .inner ul li{
width: 100%;
margin-bottom: 20px;
}
.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%;
}
.secBanner-2 .inner ul li .secTitle-3 + p{
margin-top: 15px;
}
.secBanner-2 .inner ul li a>span{
width: 100%;
}
.secBanner-2 .inner ul li{
margin-bottom: 5px;
}
.secBanner-2 .inner ul li:last-of-type{
margin-bottom: 0;
}
}.secTopHotel-1 .img{
width: 160px;
}
.secTopHotel-1 .inner ul{
justify-content: space-evenly;
margin: 25px 0 0 0;
}
.secTopHotel-1 .inner ul li.di{
width: calc((100% - 20px) / 2);
}
.secTopHotel-1 .inner ul li{
background: #f5f5f5;
cursor: pointer;
}
.secTopHotel-1 .inner ul li:hover{
transition: opacity .4s;
opacity: 0.5;
}
.secTopHotel-1 .inner ul li .hotel-info{
padding-left: 30px;
}
.secTopHotel-1 .inner ul li .hotel-info h3{
font-size: 19px;
margin-bottom: 10px;
}
.secTopHotel-1 .inner ul li .hotel-info h3 span{
font-size: 25px;
display: inline-block;
margin-left: 10px;
}
.secTopHotel-1 .inner ul li .hotel-info p{
margin-bottom: 0.5em;
}
.secTopHotel-1 .inner ul li .hotel-info p:last-child{
margin-bottom: 0;
}
@media screen and (max-width: 767px){
.secTopHotel-1 .inner ul li.di{
width: 100%;
}
.secTopHotel-1 .img{
width: 100%;
}
.secTopHotel-1 .inner ul li .hotel-info{
padding-left: 0;
padding: 20px;
}
}
 
#sp_global_navi {
display: none;
}
#spFootNavi {
display: none;
}
#menu_btn {
display: none;
} @media screen and (max-width: 959px) {
#globalNavi.scrolling { }
#globalNavi .inner nav {
display: none;
}
#top:not(.fp-viewing-1page) #spFootNavi { }
#spFootNavi.scrolling {
display: block;
}
#pageFooter {
padding-bottom: 80px;
}
#globalNavi .head-tel,
#globalNavi .fmtBtn,
#globalNavi ul.snsList{
display: none;
}
.head-nav{
width: auto;
} #sp_global_navi {
display: none;
position: fixed;
bottom: 0;
left: 0;
z-index: 9999;
width: 100%;
height: calc(100vh - 80px);
display: flex;
flex-wrap: wrap;
align-items: flex-end;
pointer-events: none;
opacity: 0;
transition: .4s;
padding: 50px 0 50px;
overflow-y: auto;
margin-bottom: 80px;
}
#sp_global_navi.active {
pointer-events: auto;
opacity: 1;
}
#sp_global_navi .navigation-container,
#sp_global_navi .sub-navigation-container {
height: auto;
margin: 15px auto 0;
}
#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;
margin-bottom: 20px;
display: block;
}
#sp_global_navi ul.snsList {
width: 100px;
height: auto;
display: flex;
margin: auto;
margin-bottom: 0px;
}
#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;
line-height: 1.5;
padding: 5px 0px;
}
#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;
}
.navigation-container ul li a::after {
left: 50%;
transform: translate(-50%, 0%);
-webkit-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
}
.navigation-container ul li.current-menu-item a::after,
.navigation-container ul li a:hover::after {
max-width: 120px;
display: none;
} #spFootNavi {
width: 100%;
height: 80px;
z-index: 10000;
position: fixed;
bottom: 0;
right: 0;
border-top: solid 1px rgba(0, 0, 0, 0.2);
padding-right: 80px;
}
#spFootNavi:after {
content: '';
width: 1px;
height: 80px;
border-right: solid 1px rgba(0, 0, 0, 0.2);
position: absolute;
top: 0;
right: 80px;
}
#spFootNavi .spFootNavi-iconList {
}
#spFootNavi .spFootNavi-iconList .box {
width: 33.33333%;
height: 80px;
margin: 0;
padding: 10px 0;
border-left: solid 1px rgba(0, 0, 0, 0.2);
}
#spFootNavi .spFootNavi-iconList .box:first-child {
border-left: none;
}
#spFootNavi .spFootNavi-iconList .box.black {
color: #fff;
background-color: #000;
}
#spFootNavi .spFootNavi-iconList .box.black * {
color: #fff;
}
#spFootNavi .spFootNavi-iconList .box.white {
color: #000;
background-color: #fff;
}
#spFootNavi .spFootNavi-iconList .box a {
height: 100%;
}
#spFootNavi .spFootNavi-iconList .box a>img {
max-width: 50px;
height: 45px;
margin: 0 auto;
} #menu_btn {
width: 30px;
height: 30px;
display: block;
z-index: 10001;
position: absolute;
bottom: 25px;
right: 25px;
}
#menu_btn.active span { }
#menu_btn span {
width: 100%;
height: 2px;
display: block;
margin: auto;
position: absolute;
left: 0;
right: 0;
background: #646464;
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);
}
}
@media screen and (max-width: 640px) {
#globalNavi .navTitle {
position: absolute;
width: auto;
height: auto;
background-color: transparent !important;
transition: all 0.2s;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
#globalNavi .navTitle span {
margin-bottom: 0.75em;
display: block;
position: absolute;
bottom: 5px;
}
#globalNavi .navTitle span br {
display: none;
}
#globalNavi .navTitle span:after {
display: none;
}
#globalNavi .navTitle a img {
max-width: 120px;
max-height: 120px;
margin: 0;
position: relative;
top: 0.3em;
}
#top #globalNavi .navTitle a img {
max-width: 120px;
max-height: 120px;
}
}
@media screen and (max-width: 320px) {
#sp_global_navi ul li {
width: 50%;
margin: 0 auto;
-webkit-writing-mode: horizontal-tb;
-ms-writing-mode: horizontal-tb;
writing-mode: lr-tb;
float: left;
margin-top: 15px;
}
}