@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP: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: 'Noto Sans JP',"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック",sans-serif;
font-size:20px;
text-align:left;
color:#333;
min-width:1000px;
}
@media screen and (max-width:767px){
html,body{ font-size:4vw; 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;}

.white{ color:#fff;}
.black{ color:#333;}
.gy{ color:#aaa;}
.red{ color:#c83232;}
.blue{ color:#326496;}

.left{ text-align:left;}
.right{ text-align:right;}
.center{ text-align:center;}

/*link*/
a{ color:inherit; text-decoration:none;}
a:hover{}
.opa{ transition: opacity 0.3s;}
.opa:hover{ opacity: 0.7;}



/*ヘッダー*/
header h1{ background: #326496; color: #fff; text-align: center; font-size: 0.8rem; padding: 0.5em;}
header dl{ display: flex; align-items: center; justify-content: center; margin: 40px auto;}
header dl dt{ width: 240px; margin-right: 40px;}
header dl dd p{ font-size: 2rem; font-weight: bold; color: #326496;}
header .fv_message{ width: 920px; margin: 0 auto; background: #c83232; border: 10px double #fff; text-align: center; padding: 30px 0 40px;}
header .fv_message h2{ font-size: 2.4rem; color: #fff;}
header .fv_message h2 strong{ color: #faf078; text-decoration: underline; font-weight: 900;}
header .fv_message h3{ margin-top: 20px; background: #fff; color: #c83232; font-size: 1.8rem; padding: 0.25em;}
header .fv_message h3 strong{ display: inline-block; margin: 0 0.5em; background: #faf078; padding: 0.25em;}
@media screen and (max-width:767px){
header h1{ font-size: 0.7rem; padding: 0.5em 0;}
header dl{ flex-direction: column-reverse; margin: 5% 3.75%;}
header dl dt{ width: 66.66%; margin: 5% auto 0;}
header dl dd p{ font-size: 1.5rem;}
header .fv_message{ width: 100%; border: 1.875vw double #fff; padding: 3.75% 0;}
header .fv_message h2{ font-size: 1.33rem; line-height: 1.5em;}
header .fv_message h3{ margin-top: 5%; font-size: 1.05rem; letter-spacing: 0; padding: 0.5em 0;}
header .fv_message h3 strong{ margin: 0 0.25em;}
}

/*フッター*/
footer{}
p.copyright{ background: #326496; color: #fff; font-size: 0.8rem; padding: 0.5em; text-align: center;}
@media screen and (max-width:767px){
p.copyright{ font-size: 0.7rem;}
}

/*メイン*/
#content{ overflow:hidden;}
section{ width:100%; margin:60px auto 120px;}
.maincontent{ padding:0; margin:0 auto; width:920px;}
@media screen and (max-width:767px){
section{ margin: 10% auto 15%;}
.maincontent{ padding:0; margin:0 auto; width:92.5%;}
}

/*tit*/
h1,h2,h3,h4,h5,h6{ line-height: 1.5em; letter-spacing: 0.05em;}
h2.tit_h2{ background: #326496; color: #fff; font-size: 2.4rem; text-align: center; padding: 0.5em; margin-bottom: 40px; position: relative;}
h2.tit_h2:before{ content: ""; width: 100%; height: 10px; background: rgba(255,255,255,0.2); position: absolute; left: 0; top: 0;}
h2.tit_h2:after{ content: ""; width: 100%; height: 10px; background: rgba(255,255,255,0.2); position: absolute; left: 0; bottom: 0;}
@media screen and (max-width:767px){
h2.tit_h2{ font-size: 1.8rem; margin-bottom: 5%;}
h2.tit_h2:before,
h2.tit_h2:after{ height: 1.25vw;}
}



/*cv*/
.cv .cv_box{ background: #329632; padding: 20px 200px 20px 40px; position: relative;}
.cv .cv_box figure.ico{ width: 180px; position: absolute; right: 20px; bottom: 0;}
.cv .cv_box h3{ text-align: center; color: #fff; font-size: 1.6rem; margin-bottom: 20px;}
.cv .cv_box a{ display: flex; align-items: center; justify-content: center; width: 100%; background: #fff; color: #329632; padding: 1em 0; font-size: 1.2rem; border-radius: 80px;}
.cv .cv_box a i{ font-size: 1.6rem; margin-right: 0.5em;}
.cv .cv_box a strong{ text-align: center;}

.cv .att{ background: #efefef; padding: 20px; margin: 20px auto;}
.cv .att dl{ display: flex; align-items: center; justify-content: center;}
.cv .att dl dt{ font-size: 1.2rem; font-weight: bold; padding: 0.25em 0.75em; border-bottom: 1px solid #333; border-top: 1px solid #333;}
.cv .att dl dd{ margin-left: 40px;}
.cv .att dl dd ul li{ font-size: 0.8rem; padding-left: 1.25em; position: relative;}
.cv .att dl dd ul li:before{ content: "※"; position: absolute; left: 0; top: 0;}

.cv p.hp_link{ text-align: center; font-size: 1.2rem;}
.cv p.hp_link i{ margin-right: 0.5em;}
.cv p.hp_link a{ text-decoration: underline; font-weight: bold;}
.cv p.hp_link a:hover{ text-decoration: none;}
@media screen and (max-width:767px){
.cv .cv_box{ padding: 3.75%; margin-top: 25vw;}
.cv .cv_box figure.ico{ width: 22.5vw; right: 0; left: 0; bottom: auto; top: -20vw; margin: auto; z-index: -1;}
.cv .cv_box h3{ font-size: 1.2rem; letter-spacing: 0; margin-bottom: 2.5%;}
.cv .cv_box a{ padding: 0.75em 0; font-size: 0.9rem; border-radius: 15vw;}
.cv .cv_box a i{ font-size: 1.5rem; margin-right: 0.5em;}

.cv .att{ padding: 3.75%; margin: 3.75% auto;}
.cv .att dl{ display: block;}
.cv .att dl dt{ text-align: center; font-size: 1rem;}
.cv .att dl dd{ margin: 2.5% auto 0;}
.cv .att dl dd ul li{ font-size: 0.75rem;}

.cv p.hp_link{ font-size: 1rem;}
}



/*lead*/
#lead ul{ border: 10px double #333; padding: 40px;}
#lead ul li{ font-size: 1.2rem; font-weight: bold; padding: 0.5em 0.5em 0.5em 2em; border-bottom: 2px dotted #333; position: relative;}
#lead ul li:first-child{ border-top: 2px dotted #333;}
#lead ul li span{ position: absolute; left: 0.5em; top: 0.5em;}
#lead ul li.red strong{ font-size: 150%; text-decoration: underline;}
#lead ul li.red span{ top: 1em;}
@media screen and (max-width:767px){
#lead ul{ border: 1.875vw double #333; padding: 3.75%;}
#lead ul li{ font-size: 0.9rem;}
#lead ul li.red strong{ font-size: 133%; text-decoration: underline;}
#lead ul li.red span{ top: 0.75em;}
}



/*area*/
#area .maincontent{ border: 10px double #326496; padding: 20px 40px;}
#area .maincontent dl{ display: flex; align-items: center; justify-content: center;}
#area .maincontent dl dd{ width: 360px;}
#area .maincontent dl dt{ text-align: center; color: #326496;}
#area .maincontent dl dt h3{ font-size: 1.6rem;}
#area .maincontent dl dt h3 strong{ display: inline-block; background: #c80000; color: #fff; padding: 0.125em 0.25em 0.25em; font-size: 2.4rem; letter-spacing: 0.1em; line-height: 1em; margin: 0 0.25em;}
#area .maincontent dl dt p{ font-size: 1.6rem; line-height: 1em; font-weight: bold;}
#area .maincontent dl dt ul{ display: flex; flex-wrap: wrap; text-align: center; align-items: center; justify-content: center; margin: 10px auto;}
#area .maincontent dl dt ul li{ background: #326496; color: #fff; padding: 0.125em 0.25em 0.25em; margin: 0.25em; font-size: 1.8rem; letter-spacing: 0.1em; line-height: 1em; font-weight: bold;}
@media screen and (max-width:767px){
#area h2{ margin-bottom: 22.5vw;}
#area .maincontent{ border: 1.875vw double #326496; background: #fff; padding: 3.75%; position: relative;}
#area .maincontent dl{ display: block;}
#area .maincontent dl dd{ width: 25vw; position: absolute; right: 0; left: 0; bottom: auto; top: -20vw; margin: auto; z-index: -1;}
#area .maincontent dl dt h3{ font-size: 1.2rem;}
#area .maincontent dl dt h3 strong{ font-size: 1.6rem;}
#area .maincontent dl dt p{ font-size: 1.2rem;}
#area .maincontent dl dt ul{ margin: 2.5% auto;}
#area .maincontent dl dt ul li{ font-size: 1.33rem;}
}



/*faq*/
#faq dl{ margin: 40px auto;}
#faq dl dt{ background: #326496; color: #fff; font-size: 1.2rem; font-weight: bold; padding: 0.5em 0.5em 0.5em 2.25em; border-left: 10px double #fff; position: relative;}
#faq dl dt span{ position: absolute; left: 1em; top: 0.5em;}
#faq dl dd{ padding: 10px 0 10px  20px; margin: 10px 20px 10px 40px; border-left: 4px solid #326496;}
#faq dl dd p{ font-size: 1rem; line-height: 1.5em; text-align: justify;}
@media screen and (max-width:767px){
#faq dl{ margin: 7.5% auto;}
#faq dl dt{ font-size: 1rem; border-left: 1.875vw;}
#faq dl dd{ padding: 1.25% 0 1.25% 3.75%; margin: 2.5% 2.5% 2.5% 6.25%; border-width: 2px;}
#faq dl dd p{ font-size: 0.8rem;}
}





@media print, screen and (min-width:768px){
.smp{ display:none !important;}
}
@media screen and (max-width:767px){
.pc{ display:none !important;}
}
