@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:#000;
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:#000;}

.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;}



/*ヘッダー*/

/*フッター*/

/*メイン*/
#content{ overflow:hidden;}
section{ width:100%; min-height: 100vh; margin:0 auto; position: relative; z-index: 1;}
section:after{ content: ""; width: 100%; height: 100%; background: hsla(0, 0%, 100%, 0.137); position: absolute; left: 0; top: 0; z-index: -1;}
.maincontent{ padding:0; margin:0 auto; width:1000px;}
@media screen and (max-width:767px){
section{ min-height: 100px;}
.maincontent{ padding:0; margin:0 auto; width:92.5%;}
}

/*tit*/
h1,h2,h3,h4,h5,h6{ line-height: 1.25em; letter-spacing: 0.05em;}
h2{ font-size: 1.8rem; margin-bottom: 20px;}
p{ font-size: 0.9rem; text-align: justify;}
@media screen and (max-width:767px){
h2{ font-size: 1.6rem; margin-bottom: 5%; text-align: center;}
p{ font-size: 0.8rem; text-align: justify;}
}


/*page_tit*/
#page_tit{ background: hsl(0, 0%, 100%); color: #011A27; text-align: center; font-size: 2.7rem; padding: 40px;}
@media screen and (max-width:767px){
#page_tit{ font-size: 2rem; padding: 7.5% 0;}
}


/*sec01*/
#sec01{ display: flex; flex-direction: column; justify-content: center; background: url("../images/01_1.jpg") center center fixed; background-size: cover; padding: 160px 0;}
#sec01 .maincontent .box{ background: #ffffff; color: #011A27; padding: 40px 60px; width: 640px; margin: 0 0 0 auto;}
@media screen and (max-width:767px){
#sec01{ background:#fff; background-size: cover; padding: 0;}
#sec01 .maincontent .box{ padding: 10% 3.75%; width: 100%;}
}


/*sec02*/
#sec02{ display: flex; flex-direction: column; justify-content: center; background: url("../images/02.jpg") center center fixed; background-size: cover; padding: 160px 0;}
#sec02 .maincontent .box{ background: #ffffff; color: #011A27; padding: 40px 60px; width: 640px; margin: 0 auto 0 0;}
@media screen and (max-width:767px){
#sec02{ background: #fff; background-size: cover; padding: 0;}
#sec02 .maincontent .box{ padding: 10% 3.75%; width: 100%;}
}


/*sec03*/
#sec03{ display: flex; flex-direction: column; justify-content: center; background: url("../images/03.jpg") center center fixed; background-size: cover; padding: 160px 0;}
#sec03 .maincontent .box{ background: #ffffff; color: #011A27; padding: 40px 60px; width: 640px; margin: 0 0 0 auto;}
@media screen and (max-width:767px){
#sec03{ background: #fff; background-size: cover; padding: 0;}
#sec03 .maincontent .box{ padding: 10% 3.75%; width: 100%;}
}


/*sec04*/
#sec04{ display: flex; flex-direction: column; justify-content: center; background: url("../images/04.jpg") center center fixed; background-size: cover; padding: 160px 0;}
#sec04 .maincontent .box{ background: #ffffff; color: #011A27; padding: 40px 60px; width: 640px; margin: 0 auto 0 0;}

#sec04 ul{ margin: 20px auto;}
#sec04 ul li{ font-size: 0.9rem; padding-left: 1.25em; line-height: 1.5em; margin: 0.5em auto; position: relative;}
#sec04 ul li:before{ content: "－"; position: absolute; left: 0; top: 0;}

#sec04 p.txt_link{ font-size: 0.8rem; line-height: 1.5em; margin-top: 20px;}
#sec04 p.txt_link a{ display: block; position: relative; padding-left: 1.5em; text-decoration: underline; color: darkcyan;}
#sec04 p.txt_link a i{ position: absolute; left: 0; top: 0.25em; line-height: 1.5em;}
#sec04 p.txt_link a:hover{ text-decoration: none;}
@media screen and (max-width:767px){
#sec04{ background: #fff; background-size: cover; padding: 0;}
#sec04 .maincontent .box{ padding: 10% 3.75%; width: 100%;}

#sec04 ul{ margin: 7.5% auto;}
#sec04 ul li{ font-size: 0.8rem;}

#sec04 p.txt_link{ font-size: 0.7rem; margin-top: 5%;}
}


/*sec05*/
#sec05{ display: flex; flex-direction: column; justify-content: center; background: url("../images/05.jpg") center center fixed; background-size: cover; padding: 160px 0;}
#sec05 .maincontent .box{ background: #ffffff; color: #011A27; padding: 40px 60px; width: 640px; margin: 0 0 0 auto;}
@media screen and (max-width:767px){
#sec05{ background: #fff; background-size: cover; padding: 0;}
#sec05 .maincontent .box{ padding: 10% 3.75%; width: 100%;}
}



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