@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/* CSS Document */
*{ margin:0; padding:0; box-sizing:border-box; word-break:break-all;}
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
ul,ol{ list-style:none;}
html,body {
margin:0 auto;
padding:0;
font-family: 'Noto Sans JP',"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック",sans-serif;
font-weight: 500;
font-size:14px;
text-align:left;
color:#555;
min-width:1200px;
}
@media screen and (max-width:767px){
html,body{ font-size:3vw; min-width:240px; max-width:767px;}
}

/*img*/
img{ border-style:none; vertical-align:bottom; padding:0; line-height:0em; max-width:100%; height:auto;}
figure{margin:0 auto; text-align:center;}

/*txt*/
p{ line-height:2.2em; margin:0 0 1em; padding:0;}
p:last-child{ margin:0;}
@media screen and (max-width:767px){
p{ line-height:1.85em;font-size: 16px;font-weight: 400!important;}
}
strong{ font-weight:bold;}
.bold { font-weight:bold;}
.normal{ font-weight:normal;}
.under_line{ text-decoration:underline;}
.line_through{ text-decoration:line-through;}
.white{ color:#fff;}
.black{ color:#666;}
.left{ text-align:left;}
.right{ text-align:right;}
.center{ text-align:center;}

/*link*/
a{ color:inherit; text-decoration:none;}
a:hover{}
.opa{ transition: all 0.3s ease;}
.opa:hover{ opacity: 0.7;}



/*ヘッダー*/
#header{ position: fixed; left: 0; right: 0; top: 0; background: rgba(255,255,255,0.75); width: 100%; min-width: 1200px; z-index: 999;}
#header dl{ display: table; table-layout: fixed; width: 100%; min-width: 1200px; margin: 0 auto; padding: 30px 120px 30px 60px;}
#header dl dt{ display: table-cell; vertical-align: bottom; width: 360px;}
#header dl dt img{ height: 60px;}
#header dl dd#smp_nav_toggle{ display: table-cell; vertical-align: bottom; text-align: right;}
#header #h_menu ul{ height: 15px; display: flex; justify-content: flex-end; align-items: center;}
#header #h_menu ul li{ font-size: 1.1rem; margin-left: 2em;}
#header #h_menu ul li a{ display: block; position: relative; transition: 0.3s;}
#header #h_menu ul li a:hover{ color: #158f98;}
#header #h_menu ul li a:after{ content: ""; width: 0%; height: 4px; background: #666; position: absolute; left: 0; right: 0; bottom: -6px; margin: auto; transition: 0.3s;}
#header #h_menu ul li a:hover:after{ width: 100%; background: #158f98;}
#header #h_sns{ position: absolute; right: 0; top: 0;}
#header #h_sns ul li a{ display: flex; align-items: center; justify-content: center; width: 60px; height: 60px;}
#header #h_sns ul li:nth-child(1) a{ background: #158f98;}
#header #h_sns ul li:nth-child(2) a{ background: #767676;}
#header #h_sns ul li a img{ width: 35px;}
@media screen and (max-width:767px){
#header dl{ padding:2.25vw 2.5vw;}
#header dl dt{ width:100%;}
#header dl dt img{ height:7.5vw;}
#header #h_menu ul{ height:auto; display:block; text-align: center;}
#header #h_menu ul li{ font-size: 1.8rem; margin: 1.5em 0;font-weight: 500;}
#header #h_menu ul li a{ display: block;}
#header #h_menu ul li a:hover{ color: #158f98;}
#header #h_menu ul li a:after{ display: none;}
#header #h_sns{ position:relative; margin-top: 5%;padding-bottom: 20%;}
#header #h_sns ul{ display: flex; justify-content: center;}
#header #h_sns ul li{ margin: 0 3vw;}
#header #h_sns ul li a{ display: flex; align-items: center; justify-content: center; width: 10vw; height: 10vw;}
#header #h_sns ul li a img{ width: 7vw;}
}

/*ハンバーガーナビ*/
@media screen and (min-width:768px){
#header dl dd#smp_nav_btn{ display: none !important;}
#header dl dd#smp_nav_toggle{ display: table-cell !important; height: auto !important;}
}
@media screen and (max-width:767px){
#header dl dd#smp_nav_btn{ background: #158f98; width:12vw; height:12vw; position:fixed; right:0; top:0; z-index:9999; transition:0.3s; cursor:pointer;}
#header dl dd#smp_nav_btn span{ height:2px; width:4vw; background:#fff; position:absolute; left:0; right:0; top:50%; transform: translateY(-50%); margin:auto; border-radius:1vw; transition:0.3s;}
#header dl dd#smp_nav_btn span:before{ content: ""; display:block; height:2px; width:4vw; background:#fff; position:absolute; bottom:8px; border-radius:1vw; transition:0.3s;}
#header dl dd#smp_nav_btn span:after{ content: ""; display:block; height:2px; width:4vw; background:#fff; position:absolute; top:8px; border-radius:1vw; transition:0.3s;}
#header dl dd#smp_nav_btn.active span{ background:rgba(255,255,255,0);}
#header dl dd#smp_nav_btn.active span:before{ bottom:0; transform: rotate(45deg);}
#header dl dd#smp_nav_btn.active span:after{ top:0; transform: rotate(-45deg);}
#header dl dd#smp_nav_toggle{ display: none; background: rgba(255,255,255,0.8); /*display: flex;*/ flex-direction: column; align-items: center; justify-content: center; position: fixed; left: 0; right: 0; top: 12.5vw; z-index: 99999; width: 100%; height: calc(100vh - 12.5vw); overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch;}
}

/*固定ヘッダー調整(js効かない時用)*/
body{ padding-top: 120px;}
@media screen and (max-width:767px){
body{ padding-top: 12vw;}
#smp_nav_toggle{ top: 12vw;}
}



/*フッター*/
#footer{ background: #383838; color: #fff; padding: 160px 0 100px; margin-top: 180px; position: relative;}
#pagetop a{ position: absolute; left: 0; right: 0; top: -60px; margin: auto; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 90%; max-width: 1200px; min-width: 1080px; height: 120px; background: #1e1e1e; color: #fff; letter-spacing: 0.1em; transition: 0.3s;}
#pagetop a:hover{ background: #000;}
#pagetop a span{ display: block; margin-bottom: 20px;}
#pagetop a img{ height: 25px;}
#footer dl{ display: flex; align-items: center; width: 90%; max-width: 1200px; min-width: 1080px; margin: 0 auto; padding: 0 30px;}
#footer dl dt{ width: 50%;}
#footer dl dt h4{ font-size: 1.25rem; line-height: 1.75em; margin-bottom: 1em;}
#footer dl dt p{ font-size: 1.05rem; line-height: 1.75em;font-weight: 400!important;}
#footer dl dd{ width: 50%; display: flex; align-items: flex-end; justify-content: flex-end;}
#footer dl dd #f_menu{}
#footer dl dd #f_menu ul li{ font-size: 1.1rem; margin-top: 1.5em;}
#footer dl dd #f_menu ul li:first-child{ margin-top: 0;}
#footer dl dd #f_menu ul li a{ display: inline-block; position: relative;}
#footer dl dd #f_menu ul li a:after{ content: ""; width: 0%; height: 4px; background: #fff; position: absolute; left: 0; right: 0; bottom: -6px; margin: auto; transition: 0.3s;}
#footer dl dd #f_menu ul li a:hover:after{ width: 100%;}
#footer dl dd #f_sns{ margin-left: 60px;}
#footer dl dd #f_sns ul li{ margin-top: 20px;}
#footer dl dd #f_sns ul li img{ width: 34px;}
@media screen and (max-width:767px){
#footer{ padding: 12.5vw 0 0; margin-top: 12.5vw;}
#pagetop a{ top: -6.25vw; min-width: 90%; height: 12.5vw; font-size: 0.66rem;}
#pagetop a span{ margin-bottom: 1.25%;}
#pagetop a img{ height: 2.5vw;}
#footer dl{ display: block; width: 100%; min-width: 100%; padding: 0;}
#footer dl dt{ width: 100%; padding: 0 5% 6.25%;}
#footer dl dt h4{ font-size: 1rem;}
#footer dl dt p{ font-size: 1rem;}
#footer dl dd{ width: 100%; display: block; padding: 6.25% 5%; background: rgba(255,255,255,0.05);}
#footer dl dd #f_menu{ text-align: center;}
#footer dl dd #f_menu ul li{ font-size: 1rem; margin-top: 1.5em;}
#footer dl dd #f_menu ul li a:after{ display: none;}
#footer dl dd #f_menu ul{ display:flex; flex-wrap:wrap;}
#footer dl dd #f_menu ul li{ width:40%; margin:2.5% auto !important;}
#footer dl dd #f_sns{ margin: 6.25% 0 0;}
#footer dl dd #f_sns ul{ display: flex; align-items: center; justify-content: center;}
#footer dl dd #f_sns ul li{ margin: 0 2.5%;}
#footer dl dd #f_sns ul li img{ width: 8vw;}
}



/*メイン*/
#content{ overflow:hidden;}
section{ width:100%; background:#fff; margin:0 auto;}
#content section:last-child{ margin-bottom: 0;}
.maincontent { padding:0; margin:0 auto; width:1080px;}
.maincontent_p { padding:0; margin:0 auto;}
@media screen and (max-width:767px){
.maincontent { padding:0; margin:0 auto; width:90%;}
.maincontent_p { padding:0; margin:0 20px 0 20px;}
}

/*tit*/
h1,h2,h3,h4,h5,h6{ line-height: 1.25em; letter-spacing: 0.05em;}




/*表示切替*/
@media print, screen and (min-width:768px){
.smp{ display:none !important;}
}
@media screen and (max-width:767px){
.pc{ display:none !important;}
}
