@charset "utf-8";
/* CSS Document */


/* 2020.0625-sakuma */
@import url(basic-style.css);
@import url(google-fonts-style.css);

/* コピーライト */
.chojyu-copyright {
  width: 100%;
  font-size: 0.7rem;
  font-weight: 300;
  letter-spacing: 0.08rem;
  text-align: center;
  color: #795548;
  background: #f4f2ea;
  margin: 50px 0 0;
  padding: 15px 0;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

/* wrap 関連
-------------------------*/
.contents-wrap {
  position: relative;
  max-width: 1440px;
  width: 100%;
  box-sizing: border-box;
  padding: 0;
  margin: 0 auto;
  color: #231815;
  box-shadow:rgba(0, 0, 0, 0.1) 0 0 20px 10px;
  overflow-x: hidden;
}
.contents-wrap img{ width: auto;}
.maincontent{ width: 1000px; margin: 0 auto;}
@media screen and (max-width: 768px) {
.maincontent{ width:90%;}
}

/* レイアウト 関連
-------------------------*/
/*MV*/
#mv{ background: url("../images/mv_bg.jpg") center top no-repeat #ecf6f8;}
#mv_in{ width: 1000px; margin: 0 auto; padding: 70px 0 50px; position: relative;}
#mv h1{ text-align: center; margin-bottom: 375px;}
#mv .mv_txt{ position: absolute; right: 110px; top: 365px;}
#mv figure{ text-align: center;}
#mv p.notice{ text-align: right; margin-top: 10px; font-size: 13px;}
#mv p.notice span{ display: inline-block; vertical-align: super; font-size: 66%; margin-right: 1em;}
@media screen and (max-width: 768px) {
#mv{ background: url("../images/mv_bg_smp.jpg") center top no-repeat #ecf6f8; background-size:100% auto;}
#mv_in{ width:100%; padding:5% 0 5%;}
#mv h1{ margin-bottom:64%; padding:0 2.5%;}
#mv .mv_txt{ width:16vw; right:7.5vw; top:38vw;}
#mv figure img{ width: 110%; max-width: 110%; margin-left: -5%;}
#mv p.notice{ text-align:center; margin-top:1em; font-size:2.5vw; line-height: 1.25em;}
}

/*cv*/
.cv{ padding: 0 0 5px; background: #ecf6f8;}
.cv.pb60{ padding-bottom: 60px;}
.cv ul{ width: 816px; margin: 0 auto; letter-spacing: -1em;}
.cv ul li{ display: inline-block; vertical-align: top; letter-spacing: 0; width: calc(50% - 16px); text-align: right;}
.cv ul li .cv_in{ position: relative; border:6px solid #f0997d; background: #fff; padding: 15px; border-radius: 12px; margin: 8px; box-shadow:rgba(0, 0, 0, 0.15) 0 0 18px 9px;}
.cv ul li .cv_in a{ position: absolute; left: 0; right: 0; bottom: 16px; margin: auto; display: block; width: 338px; background: #f58c58; color: #fff; border-bottom: 6px solid #e85e30; border-radius: 20px; text-align: center; font-size: 26px; font-weight: bold; line-height: 1em; padding: 1em; text-decoration: none; transition: 0.3s;}
.cv ul li:first-child .cv_in{ border-color: #3caeb8;}
.cv ul li:first-child .cv_in a{ background-color: #3caeb8; border-color: #379199;}
.cv ul li a:hover{ opacity: 0.7;}
.cv ul li p.notice{ display: inline-block; text-align: left; color: #f57f58; font-size: 16px; line-height: 1.5em; margin: 0 16px;}
.cv ul li:first-child p.notice{ color: #3caeb8;}
@media screen and (max-width: 768px) {
.cv{ padding:0 0 2.5%;}
.cv.pb60{ padding-bottom:7.5%;}
.cv ul{ width:95%;}
.cv ul li{ display: block; width: 100% !important;}
.cv ul li:first-child{ margin-bottom: 5%;}
.cv ul li .cv_in{ border:1vw solid #f0997d; padding:2.5%; border-radius:1.5vw; margin:0 auto 2.5%; box-shadow:rgba(0, 0, 0, 0.15) 0 0 1.5vw 1vw;}
.cv ul li:last-child .cv_in{ padding-bottom:5%;}
.cv ul li a{ bottom:4vw; width:calc(100% - 9vw) !important; border-bottom:1vw solid #e85e30; border-radius:3vw; font-size:4vw; padding: 1.125em;}
.cv ul li p.notice{ font-size:3.5vw; margin: 0 2.5%;}
}

/*sec01*/
#sec01{ position: relative; z-index: 1; background: #fff;}
#sec01:before{ content: ""; width: 100%; height: 1242px; background: url("../images/sec01_bg.jpg") center top no-repeat; position: absolute; left: 0; right: 0; top: -45px; margin: auto; z-index: -1;}
#sec01 h2{ text-align: center; margin-bottom: 45px;}
#sec01 ul.trouble{ width: calc(100% + 40px); margin-left: -20px; display: table; table-layout: fixed; border-collapse: separate; border-spacing: 20px 0;}
#sec01 ul.trouble li{ display: table-cell; vertical-align: top; position: relative;}
#sec01 ul.trouble li img{ border-radius: 10px; box-shadow:rgba(0, 0, 0, 0.1) 8px 8px 16px 10px;}
#sec01 ul.trouble li p{ width: 250px; margin: -20px auto 0; background: rgba(255,255,255,0.9); border-radius: 10px; font-size: 18px; line-height: 1.75em; padding: 1.25em; text-align: center; box-shadow:rgba(0, 0, 0, 0.1) 8px 8px 16px 10px; position: relative; z-index: 3;}
@media screen and (max-width: 768px) {
#sec01:before{ width: 100vw; height:241.3vw; background: url("../images/sec01_bg_smp.jpg") center top no-repeat; background-size:100% auto; top:-2.5vw;}
#sec01 h2{ text-align: center; margin-bottom:5%;}
#sec01 ul.trouble{ width:100%; margin-left:0; display:block; border-collapse:collapse; border-spacing:0;}
#sec01 ul.trouble li{ display:flex; align-items:center; justify-content:center; margin:0 auto 5%;}
#sec01 ul.trouble li img{ width: 65%; border-radius:1.5vw; box-shadow:rgba(0, 0, 0, 0.1) 0 0 1vw 0.5vw;}
#sec01 ul.trouble li p{ width:57.5%; margin:0 0 0 -22.5%; border-radius:1.5vw; font-size:4.5vw; line-height: 1.25em; box-shadow:rgba(0, 0, 0, 0.1) 0 0 1vw 0.5vw;}
#sec01 ul.trouble li:nth-child(2){ flex-direction: row-reverse;}
#sec01 ul.trouble li:nth-child(2) p{ margin:0 -22.5% 0 0;}
}
#sec01 h3{ margin: 280px auto 30px; text-align: center; position: relative;}
#sec01 h3 span{ position: absolute; left: 120px; top: -90px;}
#sec01 figure{ text-align: center;}
#sec01 ul.point{ margin: 30px auto 0; letter-spacing: -1em; text-align: center;}
#sec01 ul.point li{ display: inline-block; letter-spacing: 0; vertical-align: middle;}
#sec01 ul.point li.ico{ margin: 0 -15px; position: relative; z-index: 3;}
@media screen and (max-width: 768px) {
#sec01 h3{ margin:35% auto 5%;}
#sec01 h3 img{ width:95%;}
#sec01 h3 span{ width:22.5vw; left:-1.5vw; top:-21.5vw;}
#sec01 h3 span img{ width:100%;}
#sec01 figure img{ width:100%;}
#sec01 ul.point{ margin:5% auto 0; text-align:center;}
#sec01 ul.point li{ display:block;}
#sec01 ul.point li img{ width:100%;}
#sec01 ul.point li.ico{ margin:-2.5vw auto;}
#sec01 ul.point li.ico img{ width:11.11%;}
}

/*sec02*/
#sec02{ background: #fff; padding: 75px 0 130px;}
#sec02 h2{ text-align: center; margin-bottom: 75px;}
#sec02 ul li{ margin-bottom: 60px;}
#sec02 ul li dl{ display: flex; align-items: center; justify-content: center; height: 300px; position: relative; z-index: 1;}
#sec02 ul li dl:before{ content: ""; width: 200%; height: 100%; background: #f6f0e9; position: absolute; z-index: -1; right: 40px; border-radius: 20px;}
#sec02 ul li dl dt{ width: 550px; padding-left: 50px;}
#sec02 ul li dl dt img{ position: relative; top: -25px; border-radius: 20px;}
#sec02 ul li dl dd{ width: calc(100% - 494px); padding: 0 0 0 70px;}
#sec02 ul li:nth-child(2n) dl{ flex-direction: row-reverse;}
#sec02 ul li:nth-child(2n) dl:before{ left: 40px; right:auto;}
#sec02 ul li:nth-child(2n) dl dt{ padding-left:0; padding-right: 50px;}
#sec02 ul li:nth-child(2n) dl dd{ padding: 0 0 0 90px;}
@media screen and (max-width: 768px) {
#sec02{ padding:15% 0 20%;}
#sec02 h2{ margin-bottom:17.5%;}
#sec02 ul li{ margin-bottom:12.5%;}
#sec02 ul li dl{ display:block; height:auto;}
#sec02 ul li dl:before{ right:2.5vw; border-radius:1.5vw;}
#sec02 ul li dl dt{ width:100%; padding:0;}
#sec02 ul li dl dt img{ top:-5vw; border-radius:1.5vw; margin-bottom: -2.5vw;}
#sec02 ul li dl dd{ width:100%; padding:0 5% 5% 0;}
#sec02 ul li:nth-child(2n) dl:before{ left:2.5vw; right:auto;}
#sec02 ul li:nth-child(2n) dl dt{ padding:0;}
#sec02 ul li:nth-child(2n) dl dd{ padding: 0 0 5% 7.5%;}
}
#sec02 dl.attention{ width: 640px; margin: 0 auto; border: 4px solid #faf4f0; border-radius: 10px;}
#sec02 dl.attention dt{ background: #faf4f0; border-radius: 10px 10px 0 0; text-align: center; font-size: 20px; font-weight: bold; padding: 1.5em;}
#sec02 dl.attention dd{ background: #fff;}
#sec02 dl.attention dd p{ text-align: center; font-size: 16px; line-height: 1.8em; padding: 1.5em;}
@media screen and (max-width: 768px) {
#sec02 dl.attention{ width:100%; border:0.75vw solid #faf4f0; border-radius:1.5vw;}
#sec02 dl.attention dt{ border-radius:1.5vw 1.5vw 0 0; font-size:5vw; line-height:1.25em; padding:1.25em;}
#sec02 dl.attention dd p{ font-size:3.5vw; padding:1em; text-align:left;}
}

/*sec03*/
#sec03{ background: #f1f8fc; padding: 60px 0 150px; position: relative; z-index: 1;}
#sec03:before{ content: ""; width: 100%; height: 80px; background: url("../images/sec03_bg.png") center top no-repeat; position: absolute; left: 0; right: 0; top: -80px; margin: auto; z-index: -1;}
#sec03 h2{ text-align: center; margin-bottom: -60px;}
#sec03 figure.img{ text-align: center; margin-bottom: -60px;}
#sec03 dl{ background: #fff; box-shadow:rgba(86, 66, 47, 0.1) 4px 4px 8px 6px;}
#sec03 dl dt{ text-align: center; background: #231815; position: relative; padding: 5px 0 1px;}
#sec03 dl dt:after{ content: ""; width: 0; height: 0; border-style: solid; border-width: 20px 500px 0 500px; border-color: #231815 transparent transparent transparent; position: absolute; left: 0; right: 0; bottom: -19px; margin: auto;}
#sec03 dl dd{ padding: 80px 80px 40px;}
#sec03 dl dd ul{ display: table; table-layout: fixed; width: 100%; margin-bottom: 40px;}
#sec03 dl dd ul li{ display: table-cell; vertical-align: top;text-align: center;}
#sec03 dl dd p{ font-size: 16px; line-height: 1.75em;}
#sec03 dl dd p small{ font-size: 14px;}
#sec03 dl dd .composition{ background: #faf4f0; border-radius: 20px; padding: 30px; margin-top: 30px;}
#sec03 dl dd .composition h4{ text-align: center; font-size: 16px; line-height: 1em; margin-bottom: 10px;}
#sec03 dl dd .composition p{ text-align: center; font-size: 16px; line-height: 1em;}
#sec03 dl dd .composition a{ display: block; width: 470px; margin: 30px auto 0; background: #59493f; color: #fff; text-align: center; font-size: 16px; padding: 1em; border-radius: 10px; position: relative; text-decoration: none; transition: 0.3s;}
#sec03 dl dd .composition a:before{ content: ""; width: 8px; height: 15px; background: url("../images/sec03_btn_ico.png") center center; background-size: cover; position: absolute; right: 30px; top: calc(50% - 8px);}
#sec03 dl dd .composition a:hover{ opacity: 0.7;}
@media screen and (max-width: 768px) {
#sec03{ padding:0 0 27.5%;}
#sec03:before{ width:100%; height:11vw; background-size:100% 100%; top:-10vw;}
#sec03 h2{ margin-bottom:-12.5%;}
#sec03 h2 img{ width:80%;}
#sec03 figure.img{ margin-bottom:-12.5%;}
#sec03 figure.img img{ width:130%; max-width:130%; margin-left:-15%;}
#sec03 dl{ box-shadow:rgba(86, 66, 47, 0.1) 0.5vw 0.5vw 1vw 0.5vw;}
#sec03 dl dt{ padding:1% 5%;}
#sec03 dl dt:after{ border-width:5vw 43.5vw 0 43.5vw; bottom:-4.5vw;}
#sec03 dl dd{ padding:10% 5%;}
#sec03 dl dd ul{ display:block; margin-bottom:0;}
#sec03 dl dd ul li{ display:block; margin-bottom:10%;}
#sec03 dl dd ul li img{ width:90%;}
#sec03 dl dd p{ font-size:4vw;}
#sec03 dl dd p small{ font-size:3.5vw; display:block; margin-top:1.75em;}
#sec03 dl dd .composition{ border-radius:1.5vw; padding:7.5%; margin-top:10%;}
#sec03 dl dd .composition h4{ font-size:3.5vw; margin-bottom:0.5em;}
#sec03 dl dd .composition p{ font-size:3.5vw; line-height:1.5em;}
#sec03 dl dd .composition a{ width:90%; margin:5% auto 0; font-size:3.5vw; line-height:1.5em; border-radius:1.5vw;}
#sec03 dl dd .composition a:before{ width:1.5vw; height:3vw; right:5vw; top:calc(50% - 1.5vw);}
}

/*sec04*/
#sec04{ background: #fff; padding: 80px 0 150px; position: relative; z-index: 1;}
#sec04:before{ content: ""; width: 100%; height: 856px; background: url("../images/sec04_bg.png") center top no-repeat; position: absolute; left: 0; right: 0; top: -80px; margin: auto; z-index: -1;}
#sec04 h2{ text-align: center; margin-bottom: 340px;}
#sec04 p.lead{ text-align: center; margin-bottom: 140px; font-size: 24px; font-weight: bold; line-height: 1.75em; font-family: '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'メイリオ', Meiryo, serif; position: relative;}
#sec04 p.lead:after{ content: ""; width: 0; height: 100px; border-left: 2px dotted #534744; position: absolute; left: 0; right: 0; bottom: -100px; margin: auto;}
#sec04 ul{ letter-spacing: -1em; text-align: center;}
#sec04 ul li{ display: inline-block; vertical-align: middle; letter-spacing: 0; margin: 0 40px;}
#sec04 ul li dl{ display: flex; align-items: center; justify-content: center; flex-direction: column; background: #faf4f0; width: 250px; height: 250px; border-radius: 50%;}
#sec04 ul li dl dt{ font-size: 28px; font-weight: bold; line-height: 1em; font-family: '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'メイリオ', Meiryo, serif; margin-bottom: 0.75em;}
#sec04 ul li dl dd{ font-size: 18px; line-height: 1.75em;}
#sec04 p.notice{ width: 640px; margin: 30px auto 0; font-size: 20px; text-align: center; font-family: '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'メイリオ', Meiryo, serif;
background-image:
linear-gradient(90deg, rgba(96, 80, 71, 0) 0%, rgba(90, 80, 71, 0) 50%, #fff 0%, #fff 100%),
linear-gradient(180deg, rgba(96, 80, 71, 0) 0%, rgba(96, 80, 71, 0) 94.9%, rgba(96, 80, 71, 1.0) 95%, rgba(96, 80, 71, 1.0) 100%);
background-size: 4px 100%,100% 2.25em;
line-height: 2.25em;
}
@media screen and (max-width: 768px) {
#sec04{ padding:0 0 27.5%;}
#sec04:before{ width:100%; height:136.4vw; background:url("../images/sec04_bg_smp.png") center top no-repeat; background-size:cover; top:-17.5vw;}
#sec04 h2{ margin-bottom:70%;}
#sec04 h2 img{ width:75%;}
#sec04 p.lead{ margin-bottom:15%;}
#sec04 p.lead img{ width:95%;}
#sec04 p.lead:after{ height:20vw; bottom:-17.5vw;}
#sec04 ul li{ width: 50%; padding:2.5vw; margin: 0;}
#sec04 ul li dl{ width:100%; height:100%; padding:13.5% 0;}
#sec04 ul li dl dt{ font-size:6vw; margin-bottom: 0.5em;}
#sec04 ul li dl dd{ font-size:3.5vw; line-height: 1.75em; word-break: keep-all;}
#sec04 p.notice{ width:100%; margin:5% auto 0; font-size:4.5vw; padding: 0 0.5em;}
}

/*sec05*/
#sec05{ background: #f6f6f1; padding: 60px 0 80px; position: relative; z-index: 1;}
#sec05:before{ content: ""; width: 100%; height: 80px; background: url("../images/sec05_bg.png") center top no-repeat; position: absolute; left: 0; right: 0; top: -80px; margin: auto; z-index: -1;}
#sec05 h2{ text-align: center; margin-bottom: 60px;}
#sec05 h3{ text-align: center; font-size: 40px; font-weight: bold; line-height: 1em; font-family: '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'メイリオ', Meiryo, serif; margin-bottom: 50px;}
#sec05 .sec05_oil{ text-align: center; position: relative; padding: 0 0 40px; z-index: 1; margin: 0 auto 30px;}
#sec05 .sec05_oil:before{ content: ""; width: 200%; height: 300px; background: #e8e8db; position: absolute; right: 0; bottom: 0; border-radius: 20px; z-index: -1;}
#sec05 .sec05_oil figure{ text-align: center; margin-bottom: 20px;}
#sec05 .sec05_oil figure img{ border-radius: 12px;}
#sec05 .sec05_oil p{ text-align: center; font-size: 16px; line-height: 1.5em;}
#sec05 ul{ display: table; table-layout: fixed; width: calc(100% + 80px); margin-left: -40px; border-collapse: separate; border-spacing: 40px 0;}
#sec05 ul li{ display: table-cell; background: #fff; border-radius: 12px; padding: 20px 40px 40px;}
#sec05 ul li figure{ text-align: center; margin-bottom: 20px;}
#sec05 ul li h4{ text-align: center; font-size: 18px; margin-bottom: 0.25em; font-weight: bold;}
#sec05 ul li p{ text-align: center; font-size: 18px; line-height: 1.75em;}
@media screen and (max-width: 768px) {
#sec05{ padding:0 0 7.5%;}
#sec05:before{ width:100%; height:59vw; background:url("../images/sec05_bg_smp.png") center top no-repeat; background-size:cover; top:-17.5vw;}
#sec05 h2{ margin-bottom:7.5%;}
#sec05 h2 img{ width:75%;}
#sec05 h3{ font-size:7.5vw; margin-bottom:7.5%;}
#sec05 .sec05_oil{ padding:0 0 7.5%; margin:0 auto 7.5%;}
#sec05 .sec05_oil:before{ width:200%; height:60vw; right:-2.5vw; border-radius:1.5vw;}
#sec05 .sec05_oil figure{ margin-bottom:2.5%;}
#sec05 .sec05_oil figure img{ border-radius:1.5vw;}
#sec05 .sec05_oil p{ font-size:4vw;}
#sec05 ul{ display:block; width:100%; margin-left:0; border-collapse:collapse; border-spacing:0;}
#sec05 ul li{ display:block; border-radius:1.5vw; padding:5%;}
#sec05 ul li figure{ margin-bottom:2.5%;}
#sec05 ul li h4{ font-size:4vw;}
#sec05 ul li p{ font-size:3.5vw;}
}

/*sec06*/
#sec06{ background: url("../images/sec06_bg.jpg") center top no-repeat #ecf6f8; padding: 60px 0 30px;}
#sec06 .maincontent{ position: relative;}
#sec06 figure.zu{ text-align: center; margin-bottom: 400px;}
#sec06 figure.img{ text-align: center;}
#sec06 p.sec06_txt{ position: absolute; right: 160px; top: 720px;}
@media screen and (max-width: 768px) {
#sec06{ background: url("../images/sec06_bg_smp.jpg") center top no-repeat #ecf6f8; background-size:100% auto; padding:17.5% 0 2.5%;}
#sec06 figure.zu{ margin-bottom:60%;}
#sec06 figure.img{ text-align: center;}
#sec06 p.sec06_txt{ width:13.33vw; right:5vw; top:110vw;}
}

/*qanda*/
#qanda{ background: #ecf6f8; padding: 30px 0 150px;}
#qanda .maincontent{ width: 800px; margin: 0 auto; background: #fff; padding: 50px 80px 100px; box-shadow:rgba(55, 44, 44, 0.1) 0 0 30px 0; border-radius: 20px;}
#qanda h2{ text-align: center; margin-bottom: 50px;}
#qanda ul li{ margin-bottom: 50px;}
#qanda ul li:last-child{ margin-bottom: 0;}
#qanda dl dt{ font-size: 24px; line-height: 1.25em; color: #f0997d; margin-bottom: 20px; padding-left: 2em; position: relative;}
#qanda dl dt strong{ display: inline-block; font-size: 40px; font-weight: normal; position: absolute; left: 0; top: -0.125em;}
#qanda dl dd{ background: #fbf4ef; padding: 30px; border-radius: 20px;}
#qanda dl dd p{ font-size: 18px; line-height: 1.5em;}
@media screen and (max-width: 768px) {
#qanda{ padding:5% 0 15%;}
#qanda .maincontent{ width:95%; padding:10% 5%; box-shadow:rgba(55, 44, 44, 0.1) 0 0 1vw 0; border-radius:1.5vw;}
#qanda h2{ margin-bottom:10%;}
#qanda h2 img{ width:50%;}
#qanda ul li{ margin-bottom:10%;}
#qanda ul li:last-child{ margin-bottom: 0;}
#qanda dl dt{ font-size:4.5vw; margin-bottom:5%;}
#qanda dl dt strong{ font-size:7vw;}
#qanda dl dd{ padding:5%; border-radius:1.5vw;}
#qanda dl dd p{ font-size:4vw; line-height: 1.5em;}
}



/*PC/SP切り替え*/
@media print, screen and (min-width:769px){
.smp{ display:none !important;}
}
@media screen and (max-width:768px){
.pc{ display:none !important;}
}