@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;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: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
font-weight: 500;
font-size:14px;
font-feature-settings: "palt";
text-align:left;
color:#000;
min-width:1200px;
}
@media print, screen and (min-width:768px){
body{ padding-bottom: 0 !important;}
}
@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:1.75em; margin:0 0 1em; padding:0;}
p:last-child{ margin:0;}
strong{ font-weight:bold;}
.bold { font-weight:bold;}
.normal{ font-weight:normal;}
.under_line{ text-decoration:underline;}
.line_through{ text-decoration:line-through;}
.mincho{ font-family: '游明朝', YuMincho, 'メイリオ', Meiryo, serif;}
.white{ color:#fff;}
.black{ color:#000;}
.gy{ color:#aaa;}
.red{ color:#D1111B;}
.left{ text-align:left;}
.right{ text-align:right;}
.center{ text-align:center;}

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


/*ヘッダー*/
header{ background: #D1111B; color: #fff; padding: 15px 20px; position: fixed; left: 0; right: 0; top: 0; width: 100%; min-width: 1200px; z-index: 999;}
header dl{ display: flex; align-items: center; justify-content: space-between; width: 100%;}
header dl dt{ width: 200px;}
header dl dd{ width: calc(100% - 200px); max-width: 1000px;}
header dl dd #h_menu ul{ display: flex; align-items: center; justify-content: space-between; width: 100%;}
header dl dd #h_menu ul li a span{ display: inline-block; vertical-align: middle; margin-right: 8px;}
header dl dd #h_menu ul li a strong{ display: inline-block; vertical-align: middle; font-size: 18px; font-weight: bold; position: relative;}
header dl dd #h_menu ul li a strong:after{ content: ""; width: 0; height: 1px; background: #fff; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; transition: 0.3s;}
header dl dd #h_menu ul li a strong:hover:after{ width: 100%;}
header dl dd #h_menu ul li.mail a{ display: flex; align-items: center; justify-content: center; width: 200px; height: 60px; background: #fff; color: #D1111B; border-radius: 6px; transition: 0.3s;}
header dl dd #h_menu ul li.mail a:after{ display: none;}
header dl dd #h_menu ul li.mail a:hover{ opacity: 0.7;}
header dl dd #h_menu ul li.tel a{ display: flex; align-items: center; justify-content: center; width: 200px; height: 60px; background: #fff; color: #D1111B; border-radius: 6px; transition: 0.3s;}
header dl dd #h_menu ul li.tel a:after{ display: none;}
header dl dd #h_menu ul li.tel a:hover{ opacity: 0.7;}
@media print, screen and (min-width:768px){
#smp_nav_btn{ display: none !important;}
#h_menu{ display:block !important;}
#h_menu ul{ height: auto !important; padding-bottom: 0 !important;}
}
@media screen and (max-width:767px){
header{ padding:3.75vw 2.5vw;}
header dl dt{ width:50%;}
header dl dt img{ height:5vw;}
header dl dd{ width:50%;}
#h_menu{ display:none; position: fixed; width:100%; height: 100%; left: 0; right: 0; background: #FCECED; color: #707070;}
header dl dd #h_menu ul{ flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; padding:0 10%; margin:0 auto;}
header dl dd #h_menu ul li{ display:block; width:100%; margin:5% auto;}
header dl dd #h_menu ul li a{ display:flex; align-items:center;}
header dl dd #h_menu ul li a span{ display:flex; align-items:center; justify-content:center; width: 7.5vw; height:7.5vw; margin-right:7.5%;}
header dl dd #h_menu ul li a span img{ height:7.5vw;}
header dl dd #h_menu ul li a strong{ font-size:5vw;}
header dl dd #h_menu ul li a strong:after{ display:none;}
header dl dd #h_menu ul li.mail{ margin:10% auto 2.5%;}
header dl dd #h_menu ul li.mail a{ width:100%; height:15vw; border-radius:1.25vw; justify-content: flex-start; padding: 0 15%;}
header dl dd #h_menu ul li.mail a span{ margin-right:7.5%;}
header dl dd #h_menu ul li.tel{ margin-top:2.5%;}
header dl dd #h_menu ul li.tel a{ width:100%; height:15vw; border-radius:1.25vw; justify-content: flex-start; padding: 0 15%; background: #D1111B; color: #fff;}
header dl dd #h_menu ul li.tel a span{ margin-right:7.5%;}
}
@media screen and (max-width:767px){
#smp_nav_btn{ width:7.5vw; height:7.5vw; display:flex; justify-content:center; align-items:center; position:fixed; right:2.5vw; top:2.5vw; z-index:999; transition:0.3s; cursor:pointer;}
#smp_nav_btn span{ display:block; height:4px; width:7.5vw; background:#fff; position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; border-radius: 2px; transition:0.3s;}
#smp_nav_btn span:before{ content: ""; display:block; height:4px; width:7.5vw; background:#fff; position:absolute; bottom:2.25vw; border-radius: 2px; transition:0.3s;}
#smp_nav_btn span:after{ content: ""; display:block; height:4px; width:7.5vw; background:#fff; position:absolute; top:2.25vw; border-radius: 2px; transition:0.3s;}
#smp_nav_btn.active span{ background:rgba(255,255,255,0);}
#smp_nav_btn.active span:before{ bottom:0; transform: rotate(45deg);}
#smp_nav_btn.active span:after{ top:0; transform: rotate(-45deg);}
}

/*ヘッダー下層用*/
@media print, screen and (min-width:768px){
#header2{ border-top: 3px solid #D1111B; background: #fff; color: #000; padding: 30px 0;}
#header2 dl{ flex-direction: column; justify-content:center;}
#header2 dl dt{ width: 150px; margin: 0 auto 30px;}
#header2 dl dd{ width: 100%; max-width: 1080px;}
#header2 dl dd #h_menu ul li a{ display: flex; flex-direction: column-reverse; align-items: center; justify-content: center; color: #707070; transition: 0.3s;}
#header2 dl dd #h_menu ul li a span{ display: inline-block; vertical-align: middle; margin: 5px auto 0;}
#header2 dl dd #h_menu ul li a strong:after{ display: none;}
#header2 dl dd #h_menu ul li a:hover{ color: #D1111B;}
}
#h_contact{ width: 1080px; margin: auto; text-align: right; position: absolute; left: 0; right: 0; top: 0;}
#h_contact ul{ display: flex; align-items: center; text-align: center; width: 360px; height: 40px; margin: 0 0 0 auto; background: #D1111B; color: #fff; border-radius: 0 0 8px 8px;}
#h_contact ul li{ display: flex; width: 50%; height: 30px; align-items: center; justify-content: center;}
#h_contact ul li:first-child{ border-right: 4px dotted #fff;}
#h_contact ul li a{ display: flex; align-items: center; justify-content: center; width: 100%; transition: 0.3s;}
#h_contact ul li a:hover{ opacity: 0.7;}
#h_contact ul li a span{ width: 26px; margin-right: 8px; line-height: 0;}
#h_contact ul li a span img{ line-height: 0;}
#h_contact ul li a strong{ font-size: 15px;}
@media screen and (max-width:767px){
#h_contact{ display: none !important;}
#h_contact{ width:100%; text-align:center; position:fixed; top:auto; bottom:0; z-index:-1;}
#h_contact ul{ width:100%; height:12.5vw; border-radius:0;}
#h_contact ul li{ height:10vw;}
#h_contact ul li:first-child{ border-right:0.75vw dotted #fff;}
#h_contact ul li a span{ width:6vw; margin-right:2.5%;}
#h_contact ul li a strong{ font-size:4vw;}
}

/*フッター*/
footer{ background: url("../images/common/footer.png") center top no-repeat; padding-top: 270px; margin-top: 120px;}
footer nav{ background: #D1111B; color: #fff; padding: 30px;}
footer nav ul{ display: flex; align-items: center; justify-content: center; margin: 0 auto;}
footer nav ul li{ margin: 0 2em; font-size: 14px; line-height: 1em; font-weight: bold;}
footer nav ul li a:hover{ text-decoration: underline;}
@media screen and (max-width:767px){
footer{ background-size:auto 33.33vw; padding-top:33.33vw; margin-top:15%;}
footer nav{ padding:7.5%;}
footer nav ul{ width:100%; margin:-2.5vw auto; flex-wrap:wrap;}
footer nav ul li{ width:calc(50% - 5vw); margin:2.5vw; font-size:3vw;}
}


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


/*tit*/
h1,h2,h3,h4,h5,h6{ line-height: 1.25em; font-family: 'Roboto', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;}


/*btn*/
figure.btn_more{ margin-top: 60px;}
figure.btn_more a{ display: flex; align-items: center; justify-content: center; margin: 0 auto; width: 320px; height: 70px; background: #D1111B; color: #fff; font-size: 22px; line-height: 1em; font-weight: bold; border-radius: 35px; transition: 0.3s;}
figure.btn_more a span{ width: 12px; height: 12px; border-top: 4px solid #fff; border-right: 4px solid #fff; transform: rotate(45deg); margin-right: 15px;}
figure.btn_more a:hover{ opacity: 0.7;}
@media screen and (max-width:767px){
figure.btn_more{ margin-top:7.5%;}
figure.btn_more a{ width:100%; height:15vw; font-size:5vw; border-radius:7.5vw;}
figure.btn_more a span{ width:2.5vw; height:2.5vw; border-top:1vw solid #fff; border-right:1vw solid #fff; margin-right:5%;}
}



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