@charset "utf-8";
/* CSS Document */

/*----------------------------------------------------------
title
----------------------------------------------------------*/
.titleTypeA01{
font-size: 3.2rem;
font-weight: 700;
text-align: center;
line-height: 1.4;
letter-spacing: 2px;
margin: 0 0 60px;
}
.titleTypeA01 strong{
color: #cc0306;
font-size: 4.0rem;
font-weight: 900;
}
.titleTypeA01 b{
font-size: 4.0rem;
font-weight: 900;
}
.titleTypeA01 span{
font-size: 1.6rem;
letter-spacing: 0;
margin: 0 0 10px;
padding: 0 0 5px;
display: inline-block;
position: relative;
}
.titleTypeA01 span::before{
content: "";
width: 100%;
height: 2px;
background: #222;
position: absolute;
left: 0;
bottom: 0;
}
@media (max-width: 768px){
.titleTypeA01{
font-size: 2.2rem;
text-align: left;
margin: 0 0 3.5rem;
}
.titleTypeA01 strong{
font-size: 2.9rem;
}
.titleTypeA01 b{
font-size: 2.9rem;
}
.titleTypeA01 span{
font-size: 1.4rem;
margin: 0 0 1.0rem;
padding: 0 0 0.5rem;
}
.titleTypeA01 span::before{
height: 0.2rem;
}
}

/*----------------------------------------------------------
button
----------------------------------------------------------*/
.btnTypeA01{
text-align: center;
position: relative;
z-index: 10;
}
.btnTypeA01 a{
background-image: linear-gradient(#ee0004,#ad0003);
color: #fff;
font-size: 2.4rem;
font-weight: 900;
line-height: 1.0;
border-radius: 100px;
padding: 20px 90px 22px 150px;
position: relative;
}
.btnTypeA01 a::before{
content: "";
width: 14px;
height: 20px;
background: #fff;
clip-path: polygon(0 0, 0% 100%, 100% 50%);
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
}
.btnTypeA01 a img{
width: 100px;
height: 100px;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
@media (max-width: 768px){
.btnTypeA01{
margin: 0 2.0rem;
}
.btnTypeA01 a{
font-size: 2.0rem;
padding: 2.0rem 0 2.2rem 4.8rem;
display: block;
}
.btnTypeA01 a::before{
width: 0.9rem;
height: 1.5rem;
right: 2.0rem;
}
.btnTypeA01 a img{
width: 7.5rem;
height: 7.5rem;
left: -0.2rem;
}
}

.floatBtn{
position: fixed;
right: 35px;
bottom: 35px;
z-index: 10;
opacity: 0;
transition: 0.3s;
}
.floatBtn.active{
opacity: 1.0;
}
.floatBtn.active .btnTypeA01 a{
-moz-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.6);
-ms-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.6);
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.6);
}
@media (max-width: 768px){
.floatBtn{
width: 100%;
right: 0;
bottom: 2.0rem;
}
.floatBtn.active .btnTypeA01 a{
-moz-box-shadow: 0 0 1.0rem 0 rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 0 0 1.0rem 0 rgba(0, 0, 0, 0.6);
-ms-box-shadow: 0 0 1.0rem 0 rgba(0, 0, 0, 0.6);
box-shadow: 0 0 1.0rem 0 rgba(0, 0, 0, 0.6);
}
}

/*----------------------------------------------------------
mainVisual
----------------------------------------------------------*/
.mainVisual{
background: url("../img/mv_bg_01.webp"),#4f9ad4;
background-size: 100% 800px,100% 100%;
background-position: bottom center,bottom center;
}
.mainVisual .inner{
width: 940px;
text-align: center;
margin: 0 auto;
padding: 40px 0 60px 350px;
position: relative;
}
.mainVisual .inner::before{
content: "";
width: 390px;
height: 485px;
background: url("../img/mv_img_01.webp") no-repeat;
background-size: 100% auto;
position: absolute;
left: 0;
bottom: 0;
}
.mainVisual .inner .title{
color: #fff;
font-size: 4.0rem;
font-weight: 900;
line-height: 1.4;
letter-spacing: 2px;
text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.35);
margin: 0 auto 45px;
}
.mainVisual .inner .title strong{
font-size: 5.6rem;
font-weight: 900;
}
.mainVisual .inner .logo img{
width: 350px;
}
.mainVisual .inner .text01{
margin: 0 0 25px;
position: relative;
z-index: 2;
}
.mainVisual .inner .text01 span{
background: #f3f3f3;
font-size: 2.2rem;
font-weight: 700;
line-height: 1.0;
letter-spacing: 1px;
padding: 10px 25px;
display: inline-block;
}
.mainVisual .inner .text01 span:nth-of-type(2){
margin-top: 10px;
}
.mainVisual .inner .text01 span strong{
color: #cc0306;
font-size: 2.8rem;
font-weight: 900;
}
.mainVisual .inner .text01 span b{
font-size: 2.8rem;
font-weight: 900;
}
.mainVisual .inner .text02{
margin: 0 0 25px;
}
.mainVisual .inner .text02 span{
background: #222;
color: #fff;
font-size: 1.8rem;
font-weight: 700;
line-height: 1.0;
padding: 10px 25px 12px;
display: inline-block;
position: relative;
z-index: 2;
}
.mainVisual .inner .text02 span::before{
content: "";
width: 60px;
height: 100%;
background: #222;
clip-path: polygon(100% 0, 0% 100%, 100% 100%);
position: absolute;
left: -59px;
top: 0;
}
.mainVisual .inner .text02 span::after{
content: "";
width: 60px;
height: 100%;
background: #222;
clip-path: polygon(0 0, 0 100%, 100% 0);
position: absolute;
right: -59px;
top: 0;
}
.mainVisual .inner .text02 span strong{
font-size: 2.6rem;
font-weight: 900;
margin: 0 5px;
}
@media (max-width: 768px){
.mainVisual{
background-size: auto 100%,100% 100%;
}
.mainVisual .inner{
width: 100%;
text-align: left;
padding: 3.0rem 0 2.0rem;
}
.mainVisual .inner::before{
width: 23.7rem;
height: 29.7rem;
}
.mainVisual .inner .title{
font-size: 1.8rem;
text-align: right;
text-shadow: 0 0 1.0rem rgba(0, 0, 0, 0.35);
line-height: 1.6;
letter-spacing: 1px;
margin: 0 2.0rem 4.0rem 0;
}	
.mainVisual .inner .title span{
text-align: left;
display: inline-block;
}
.mainVisual .inner .title strong{
font-size: 2.5rem;
}
.mainVisual .inner .logo{
width: auto;
text-align: right;
margin: 0 2.0rem 0 0;
}
.mainVisual .inner .logo img{
width: 11.0rem;
}
.mainVisual .inner .text01{
margin: 0 0 4.0rem;
}
.mainVisual .inner .text01 span{
font-size: 1.6rem;
padding: 1.0rem 1.0rem 1.0rem 2.0rem;
}
.mainVisual .inner .text01 span:nth-of-type(2){
margin-top: 0.5rem;
}
.mainVisual .inner .text01 span strong{
font-size: 2.0rem;
}
.mainVisual .inner .text01 span b{
font-size: 2.0rem;
}
.mainVisual .inner .text02{
text-align: right;
margin: 0 0 2.0rem;
}
.mainVisual .inner .text02 span{
font-size: 1.4rem;
padding: 0.8rem 2.0rem 1.0rem 1.0rem;
}
.mainVisual .inner .text02 span::before{
width: 3.0rem;
left: -2.9rem;
}
.mainVisual .inner .text02 span::after{
display: none;
}
.mainVisual .inner .text02 span strong{
font-size: 2.0rem;
margin: 0 0.2rem 0 0.6rem;
}
}

.cvBlock{
background: url("../img/sec09_bg_01.webp");
background-size: 30px;
border-top: 6px solid #222;
border-bottom: 6px solid #222;
padding: 30px 0;
}
.cvBlock .cvInner{
width: 1000px;
margin: 0 auto;
}
.cvBlock .cvInner .text{
text-align: center;
margin: 0 0 40px;
}
.cvBlock .cvInner .text span{
font-size: 2.2rem;
font-weight: 900;
padding: 0 0 0 45px;
display: inline-block;
position: relative;
z-index: 1;
}
.cvBlock .cvInner .text span::before{
content: "";
width: 36px;
height: 34px;
background: url("../img/mv_ico_01.webp") no-repeat;
background-size: 100% auto;
position: absolute;
left: 0;
top: 1px;
}
@media (max-width: 768px){
.cvBlock{
background-size: 3.0rem;
border-top: 0.4rem solid #222;
border-bottom: 0.4rem solid #222;
padding: 1.5rem 0 2.0rem;
}
.cvBlock .cvInner{
width: 100%;
}
.cvBlock .cvInner .text{
margin: 0 0 2.0rem;
}
.cvBlock .cvInner .text span{
font-size: 1.8rem;
text-align: left;
padding: 0 0 0 4.8rem;
}
.cvBlock .cvInner .text span::before{
width: 3.6rem;
height: 3.4rem;
top: 50%;
transform: translateY(-50%);
}
}

/*----------------------------------------------------------
section
----------------------------------------------------------*/
[class^="section"]{
position: relative;
z-index: 2;
}
[class^="section"] .secInner01{
width: 800px;
margin: 0 auto;
}
[class^="section"] .secInner02{
width: 800px;
margin: 0 auto;
}
@media (max-width: 768px){
[class^="section"] .secInner01{
width: auto;
margin: 0 2.0rem;
}
[class^="section"] .secInner02{
width: auto;
}
}

/* -- section01 -- */
.section01{
background: url("../img/sec01_bg_01_pc.webp"),#e8edf2;
background-size: auto 100%,100% 100%;
background-position: top right,top center;
background-repeat: no-repeat,repeat;
padding: 120px 0 40px;
}
.section01::before{
content: "";
width: 100%;
height: 80px;
background: #d4e0ed;
clip-path: polygon(0 0, 100% 0, 100% 33%, 0 100%);
position: absolute;
left: 0;
top: -1px;
z-index: -1;
}
.section01 .block{
margin: 0 auto 40px;
display: flex;
align-items: center;
}
.section01 .block .box01{
width: 420px;
}
.section01 .block .box01 .text{
font-size: 1.8rem;
line-height: 1.8;
}
.section01 .block .box01 .text + .text{
margin-top: 20px;
}
.section01 .block .box01 .text b{
color: #cc0306;
font-weight: 900;
}
.section01 .block .box02{
width: 380px;
}
.section01 .block .box02 .list{
margin: 0 0 20px;
}
.section01 .block .box02 .list > li{
background: #222;
color: #fff;
font-size: 1.6rem;
text-align: center;
margin: 0 0 5px;
padding: 6px 20px;
}
.section01 .block .box02 .list > li b{
color: #fff600;
}
.section01 .notes{
font-size: 1.4rem;
text-align: center;
}
.section01 .notes a{
color: #0067db;
font-weight: 700;
text-decoration: underline;
}
@media (max-width: 768px){
.section01{
background: url("../img/sec01_bg_01_sp.webp"),#e8edf2;
background-size: 100% auto,100% 100%;
background-position: top right,top center;
background-repeat: no-repeat,repeat;
padding: 7.0rem 0 1.5rem;
}
.section01::before{
height: 6.0rem;
clip-path: polygon(100% 0, 0% 100%, 0 0);
top: -0.1rem;
}
.section01 .block{
margin: 0 auto 2.5rem;
display: block;
}
.section01 .block .box01{
width: 100%;
margin: 0 0 3.0rem;
}
.section01 .block .box01 .text{
font-size: 1.6rem;
}
.section01 .block .box01 .text + .text{
margin-top: 2.0rem;
}
.section01 .block .box02{
width: 100%;
}
.section01 .block .box02 .list{
margin: 0 0 2.0rem;
}
.section01 .block .box02 .list > li{
font-size: 1.4rem;
text-align: left;
margin: 0 0 0.5rem;
padding: 0.8rem 2.0rem;
}
}

/* -- section02 -- */
.section02{
padding: 60px 0 120px;
overflow: hidden;
}
.section02::after{
content: "";
width: 460px;
height: 300px;
background: url("../img/common_arrow_01.webp") no-repeat;
background-size: 100% 100%;
position: absolute;
right: -60px;
top: -85px;
z-index: 3;
}
.section02 .block .list{
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.section02 .block .list > li{
min-width: 360px;
font-size: 2.0rem;
font-weight: 700;
margin: 0 0 20px;
padding: 0 0 0 30px;
position: relative;
}
.section02 .block .list > li:last-child{
margin-bottom: 0;
}
.section02 .block .list > li::before{
content: "";
width: 22px;
height: 22px;
background: url("../img/sec02_ico_01.webp") no-repeat;
background-size: 100% auto;
background-position: top left;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.section02 .block .list > li b{
color: #cc0306;
font-weight: 900;
}
@media (max-width: 768px){
.section02{
padding: 3.0rem 0 8.0rem;
}
.section02::after{
width: 8.7rem;
height: 15.5rem;
background-size: auto 100%;
right: 0;
top: -4.0rem;
}
.section02 .block{
text-align: center;
}
.section02 .block .list{
text-align: left;
display: inline-block;
}
.section02 .block .list > li{
min-width: 100%;
font-size: 1.6rem;
margin: 0 0 1.0rem;
padding: 0 0 0 3.0rem;
}
.section02 .block .list > li::before{
width: 2.0rem;
height: 2.0rem;
}
}

/* -- section03 -- */
.section03{
background: #e8edf2;
padding: 40px 0 0;
}
.section03::before{
content: "";
width: 100%;
height: 80px;
background: #e8edf2;
clip-path: polygon(100% 0, 0% 100%, 100% 100%);
position: absolute;
left: 0;
top: -79px;
z-index: -1;
}
.section03 .title{
font-size: 2.2rem;
font-weight: 700;
text-align: center;
margin: 0 0 20px;
}
.section03 .title strong{
color: #cc0306;
font-size: 4.0rem;
font-weight: 900;
display: block;
}
.section03 .block{
position: relative;
z-index: 1;
}
.section03 .block::before{
content: "";
width: 100%;
height: 100px;
background: linear-gradient(#e8edf2,#d4e0ed);
position: absolute;
left: 0;
bottom: 0;
z-index: -1;
}
.section03 .block .box{
width: 800px;
margin: 0 auto;
padding: 40px 260px 40px 0;
position: relative;
}
.section03 .block .box .ttl{
font-size: 2.6rem;
line-height: 1.4;
font-weight: 900;
margin: 0 0 20px;
}
.section03 .block .box .ttl strong{
color: #cc0306;
font-weight: 900;
}
.section03 .block .box .ttl span{
font-size: 1.8rem;
letter-spacing: 2px;
margin: 0 0 10px;
display: inline-block;
position: relative;
}
.section03 .block .box .ttl span::before{
content: "";
width: 100%;
height: 2px;
background: #222;
position: absolute;
left: 0;
bottom: 0;
}
.section03 .block .box .ttl span b{
color: #cc0306;
font-size: 2.6rem;
font-weight: 900;
}
.section03 .block .box .text{
font-size: 1.8rem;
line-height: 1.8;
}
.section03 .block .box .text span{
color: #727272;
font-size: 1.4rem;
display: block;
}
.section03 .block .box .image{
width: 230px;
position: absolute;
right: 0;
bottom: 0;
}
@media (max-width: 768px){
.section03{
padding: 3.0rem 0 0;
}
.section03::before{
height: 6.0rem;
top: -5.9rem;
}
.section03 .title{
font-size: 1.4rem;
margin: 0 0 1.0rem;
}
.section03 .title strong{
font-size: 2.9rem;
}
.section03 .block::before{
height: 12.5rem;
}
.section03 .block .box{
width: 100%;
padding: 3.0rem 2.0rem 2.0rem;
}
.section03 .block .box .ttl{
font-size: 2.0rem;
margin: 0 0 2.0rem;
}
.section03 .block .box .ttl span{
font-size: 1.4rem;
margin: 0 0 2.0rem;
}
.section03 .block .box .ttl span::before{
width: calc(100% + 2.0rem);
height: 0.2rem;
left: -2.0rem;
}
.section03 .block .box .ttl span b{
font-size: 2.4rem;
}
.section03 .block .box .text{
font-size: 1.5rem;
}
.section03 .block .box .image{
width: 12.0rem;
right: 2.0rem;
top: 3.2rem;
bottom: auto;
}
}

/* -- section04 -- */
.section04{
background: url("../img/sec04_bg_01.webp") no-repeat;
background-size: cover;
background-position: bottom center;
padding: 80px 0;
}
.section04 .block{
border: 1px solid #fff;
position: relative;
}
.section04 .block + .block{
margin-top: 40px;
}
.section04 .block .title{
margin: 0 0 25px;
}
.section04 .block .title span{
background: #fff;
color: #222;
font-size: 2.2rem;
font-weight: 900;
padding: 3px 30px 5px;
display: inline-block;
}
.section04 .block .ttl{
color: #fff;
font-size: 2.0rem;
font-weight: 700;
margin: 0 30px 15px;
}
.section04 .block .box{
padding: 0 30px 30px;
display: flex;
align-items: center;
}
.section04 .block .box .text{
color: #fff;
font-size: 1.6rem;
line-height: 1.8;
margin: 0 30px 0 0;
}
.section04 .block .box .image{
width: 260px;
}
@media (max-width: 768px){
.section04{
padding: 6.0rem 0 4.0rem;
}
.section04 .block + .block{
margin-top: 5.0rem;
}
.section04 .block .title{
margin: -2.2rem 0 2.0rem;
}
.section04 .block .title span{
background: none;
font-size: 2.0rem;
padding: 0.3rem 2.0rem 0.5rem 0;
position: relative;
}
.section04 .block .title span::before{
content: "";
width: calc(100% + 2.0rem);
height: 100%;
background: #fff;
position: absolute;
left: -2.1rem;
top: 0;
z-index: -1;
}
.section04 .block .ttl{
font-size: 1.8rem;
margin: 0 2.0rem 1.5rem;
}
.section04 .block .box{
padding: 0 2.0rem 2.0rem;
display: block;
}
.section04 .block .box .text{
font-size: 1.4rem;
margin: 0 0 2.0rem;
}
.section04 .block .box .image{
width: 100%;
}
}

/* -- section05 -- */
.section05{
background: #e8edf2;
padding: 70px 0 80px;
}
.section05 .block{
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.section05 .block .box .titleTypeA01{
text-align: left;
margin-bottom: 30px;
}
.section05 .block .box .text{
font-size: 1.8rem;
line-height: 1.8;
}
.section05 .block .list{
width: 300px;
display: flex;
flex-wrap: wrap;
}
.section05 .block .list > li{
width: 50%;
}
.section05 .block .list > li.ttl{
background: #5b5b5b;
color: #fff;
font-size: 1.8rem;
font-weight: 400;
display: flex;
justify-content: center;
align-items: center;
}
@media (max-width: 768px){
.section05{
padding: 3.0rem 0 0;
}
.section05 .block{
display: block;
}
.section05 .block .box{
margin: 0 2.0rem 3.5rem;
}
.section05 .block .box .titleTypeA01{
margin-bottom: 3.5rem;
}
.section05 .block .box .text{
font-size: 1.6rem;
}
.section05 .block .list{
width: 100%;
flex-wrap: nowrap;
}
.section05 .block .list > li{
width: auto;
}
.section05 .block .list > li.ttl{
display: none;
}
}

/* -- section06 -- */
.section06{
padding: 70px 0 80px;
}
.section06 .text01{
background: #9d1111;
color: #fff;
font-size: 1.4rem;
margin: 0 0 20px;
padding: 20px 30px;
}
.section06 .text02{
font-size: 1.6rem;
line-height: 1.8;
margin: 0 0 60px;
}
.section06 .block01{
margin: 0 0 50px;
position: relative;
z-index: 1;
}
.section06 .block01::before{
content: "";
width: 300px;
height: 285px;
background: url("../img/common_arrow_01.webp") no-repeat;
background-size: 100% auto;
background-position: top left;
position: absolute;
right: 40px;
top: -10px;
z-index: -1;
}
.section06 .block01::after{
content: "";
width: 195px;
height: 252px;
background: url("../img/sec06_img_01.webp") no-repeat;
background-size: 100% 100%;
position: absolute;
right: 85px;
top: 10px;
z-index: -1;
}
.section06 .block01 .titleTypeA01{
text-align: left;
text-shadow: 2px 2px 0 #fff,-2px -2px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,0 2px 0 #fff,0 -2px 0 #fff,-2px 0 0 #fff, 2px 0 0 #fff;
margin-bottom: 30px;
}
.section06 .block01 .name{
font-size: 1.6rem;
}
.section06 .block01 .name b{
font-size: 2.2rem;
display: block;
}
.section06 .block02 .title{
text-align: center;
margin: 0 0 30px;
position: relative;
}
.section06 .block02 .title::before{
content: "";
width: 100%;
height: 1px;
background: #222;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
z-index: -1;
}
.section06 .block02 .title span{
background: #222;
color: #fff;
font-size: 2.2rem;
font-weight: 900;
border-radius: 100px;
padding: 3px 40px 5px;
}
@media (max-width: 768px){
.section06{
padding: 3.0rem 0 4.0rem;
}
.section06 .text01{
font-size: 1.2rem;
margin: 0 0 2.5rem;
padding: 2.0rem 1.5rem;
}
.section06 .text02{
font-size: 1.4rem;
margin: 0 2.0rem 2.5rem;
}
.section06 .block01{
margin: 0 0 2.5rem 2.0rem;
}
.section06 .block01::before{
width: 8.7rem;
height: 15.5rem;
background-size: auto 100%;
right: 0;
top: -4.8rem;
}
.section06 .block01::after{
width: 13.8rem;
height: 17.8rem;
right: 0.3rem;
top: 0.8rem;
}
.section06 .block01 .titleTypeA01{
margin-bottom: 2.5rem;
}
.section06 .block01 .name{
font-size: 1.4rem;
line-height: 1.4;
}
.section06 .block01 .name b{
font-size: 1.8rem;
}
.section06 .block02 .title{
margin: 0 0 2.0rem;
}
.section06 .block02 .title span{
font-size: 1.8rem;
padding: 0.3rem 2.0rem 0.5rem;
}
.section06 .block02 .image{
width: calc(100% - 4.0rem);
margin: 0 auto;
display: block;
}
}

/* -- section07 -- */
.section07{
background: #f3f3f3;
padding: 70px 0 80px;
}
.section07 .list{
margin: 0 0 30px;
display: flex;
}
.section07 .list > li{
width: 25%;
font-size: 1.4rem;
text-align: center;
line-height: 1.4;
}
.section07 .list > li span{
font-size: 1.2rem;
margin: 3px 0 0;
display: block;
}
.section07 .list > li .image{
width: 100px;
margin: 0 auto 10px;
display: block;
}
.section07 .block{
background: #fff;
padding: 20px 30px;
}
.section07 .block .text{
font-size: 1.4rem;
}
.section07 .block .text + .text{
margin-top: 15px;
}
.section07 .block .text b{
font-weight: 700;
display: block;
}
@media (max-width: 768px){
.section07{
padding: 3.0rem 0 4.0rem;
}
.section07 .list{
margin: 0 0 2.0rem;
flex-wrap: wrap;
}
.section07 .list > li{
width: 50%;
font-size: 1.2rem;
margin: 0 0 2.0rem;
}
.section07 .list > li:nth-last-child(-n+3){
margin-bottom: 0;
}
.section07 .list > li span{
font-size: 1.0rem;
margin: 0.2rem 0 0;
}
.section07 .list > li .image{
width: 8.4rem;
margin: 0 auto 1.0rem;
}
.section07 .block{
padding: 2.0rem;
}
.section07 .block .text{
font-size: 1.2rem;
}
.section07 .block .text + .text{
margin-top: 1.5rem;
}
}

/* -- section08 -- */
.section08{
background: url("../img/sec08_bg_01.webp");
background-size: 30px;
padding: 70px 0 80px;
}
.section08 .block{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.section08 .block .box{
width: 385px;
background: #f3f3f3;
border: 1px solid #222;
-moz-box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
-webkit-box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
-ms-box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
padding: 0 0 20px;
}
.section08 .block .box .title{
min-height: 110px;
background: #fff600;
font-size: 1.8rem;
font-weight: 900;
text-align: center;
line-height: 1.4;
margin: 0 0 10px;
padding: 0 20px;
display: flex;
align-items: center;
justify-content: center;
}
.section08 .block .box .inner{
margin: 0 20px 10px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
.section08 .block .box .inner .nameBlock{
width: calc(100% - 80px);
text-align: center;
padding: 0 20px 0 0;
}
.section08 .block .box .inner .nameBlock .name{
font-size: 1.8rem;
font-weight: 700;
margin: 0 0 5px;
}
.section08 .block .box .inner .nameBlock .name span{
font-size: 1.4rem;
}
.section08 .block .box .inner .nameBlock .txt{
background: #222;
color: #fff;
font-size: 1.4rem;
border-radius: 5px;
padding: 3px 0 5px;
}
.section08 .block .box .inner .nameBlock .txt b{
color: #fff600;
font-weight: 700;
}
.section08 .block .box .inner .image{
width: 80px;
}
.section08 .block .box .text{
font-size: 1.6rem;
margin: 0 20px;
}
.section08 .block .box .text + .text{
margin-top: 15px;
}
.section08 .block .box .text b{
color: #cc0306;
}
@media (max-width: 768px){
.section08{
background-size: 3.0rem;
padding: 3.0rem 0 4.0rem;
}
.section08 .block{
display: block;
}
.section08 .block .box{
width: 100%;
-moz-box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
-webkit-box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
-ms-box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
padding: 0 0 2.0rem;
}
.section08 .block .box + .box{
margin-top: 2.0rem;
}
.section08 .block .box .title{
min-height: auto;
font-size: 1.6rem;
margin: 0 0 1.0rem;
padding: 1.0rem;
display: block;
}
.section08 .block .box .inner{
margin: 0 1.0rem 1.0rem;
}
.section08 .block .box .inner .nameBlock{
width: calc(100% - 9.0rem);
padding: 0 1.0rem 0 0;
}
.section08 .block .box .inner .nameBlock .name{
font-size: 1.6rem;
margin: 0 0 1.0rem;
}
.section08 .block .box .inner .nameBlock .txt{
border-radius: 0.5rem;
padding: 0.3rem 0 0.5rem;
}
.section08 .block .box .inner .image{
width: 9.0rem;
}
.section08 .block .box .text{
font-size: 1.4rem;
margin: 0 2.0rem;
}
.section08 .block .box .text + .text{
margin-top: 1.5rem;
}
}

/* -- section09 -- */
.section09{
background: url("../img/sec09_bg_01.webp");
background-size: 30px;
padding: 70px 0 80px;
}
.section09 .block{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.section09 .block .box{
width: 385px;
background: #fff;
border: 1px solid #222;
-moz-box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
-webkit-box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
-ms-box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
box-shadow: 10px 10px 0px 0px rgba(34, 34, 34, 0.4);
padding: 0 0 20px;
}
.section09 .block .box .title{
min-height: 105px;
background: #9d1111;
color: #fff;
font-size: 1.8rem;
font-weight: 900;
text-align: center;
line-height: 1.4;
margin: 0 0 20px;
padding: 0 20px;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
}
.section09 .block .box .title span{
font-size: 1.4rem;
font-weight: 500;
margin: 7px 0 0;
display: block;
}
.section09 .block .box .text{
font-size: 1.6rem;
margin: 0 20px;
}
.section09 .block .box .text + .text{
margin-top: 15px;
}
.section09 .block .box .text b{
color: #cc0306;
}
@media (max-width: 768px){
.section09{
background-size: 3.0rem;
padding: 3.0rem 0 4.0rem;
}
.section09 .block{
display: block;
}
.section09 .block .box{
width: 100%;
-moz-box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
-webkit-box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
-ms-box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
box-shadow: 1.0rem 1.0rem 0px 0px rgba(34, 34, 34, 0.4);
padding: 0 0 2.0rem;
}
.section09 .block .box + .box{
margin-top: 2.0rem;
}
.section09 .block .box .title{
min-height: auto;
font-size: 1.7rem;
margin: 0 0 2.0rem;
padding: 1.0rem 2.0rem;
display: block;
}
.section09 .block .box .title span{
margin: 0.5rem 0 0;
}
.section09 .block .box .text{
font-size: 1.4rem;
margin: 0 2.0rem;
}
.section09 .block .box .text + .text{
margin-top: 1.5rem;
}
}

/* -- section10 -- */
.section10{
padding: 70px 0 80px;
}
.section10 .block{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.section10 .block .box{
width: 390px;
margin: 0 0 20px;
}
.section10 .block .box:nth-last-of-type(1){
margin-bottom: 0;
}
.section10 .block .box .title{
background: #fff600;
border: 1px solid #222;
display: flex;
align-items: center;
position: relative;
cursor: pointer;
}
.section10 .block .box .title::before{
content: "";
width: 23px;
height: 3px;
background: #fff;
position: absolute;
right: 28px;
top: 50%;
transform: translateY(-50%);
z-index: 1;
}
.section10 .block .box .title::after{
content: "";
width: 23px;
height: 3px;
background: #fff;
position: absolute;
right: 28px;
top: 50%;
transform: translateY(-50%) rotate(90deg);
z-index: 1;
opacity: 1.0;
transition: 0.5s;
}
.section10 .block .box .title.active::after{
opacity: 0;
transform: rotate(0deg);
}
.section10 .block .box .title span{
width: 50px;
min-height: 90px;
background: #222;
color: #fff;
font-size: 2.0rem;
font-weight: 900;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
.section10 .block .box .title b{
width: calc(100% - 50px);
font-size: 1.6rem;
font-weight: 700;
line-height: 1.4;
padding: 0 50px 0 20px;
position: relative;
}
.section10 .block .box .title b::before{
content: "";
width: 40px;
height: 40px;
background: #222;
border-radius: 100px;
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
}
.section10 .block .box .text{
background: #f3f3f3;
font-size: 1.6rem;
border: 1px solid #222;
margin: 10px 0 0;
padding: 20px;
display: none;
}
@media (max-width: 768px){
.section10{
padding: 3.0rem 0 4.0rem;
}
.section10 .block{
display: block;
}
.section10 .block .box{
width: 100%;
margin: 0 0 2.0rem;
}
.section10 .block .box .title{
align-items: stretch;
}
.section10 .block .box .title::before{
width: 1.5rem;
height: 0.3rem;
right: 2.55rem;
}
.section10 .block .box .title::after{
width: 1.5rem;
height: 0.3rem;
right: 2.55rem;
}
.section10 .block .box .title span{
width: 5.0rem;
min-height: auto;
}
.section10 .block .box .title b{
width: calc(100% - 5.0rem);
font-size: 1.4rem;
padding: 1.0rem 5.0rem 1.0rem 1.5rem;
}
.section10 .block .box .title b::before{
width: 2.5rem;
height: 2.5rem;
right: 2.0rem;
}
.section10 .block .box .text{
font-size: 1.4rem;
margin: 1.0rem 0 0;
padding: 2.0rem;
}
}

/* -- section11 -- */
.section11{
background: url("../img/sec11_bg_01.webp") no-repeat;
background-size: 100% 100%;
padding: 80px 0;
}
.section11 .title{
color: #fff;
font-size: 3.2rem;
font-weight: 700;
text-align: center;
line-height: 1.4;
margin: 0 0 40px;
}
.section11 .title strong{
font-size: 4.0rem;
font-weight: 900;
}
.section11 .text{
color: #fff;
font-size: 1.8rem;
text-align: center;
line-height: 1.8;
margin: 0 0 40px;
}
.section11 .list{
display: flex;
justify-content: space-between;
}
.section11 .list > li{
width: 255px;
background: #fff;
text-align: center;
font-weight: 700;
line-height: 1.8;
border-radius: 0 0 10px 10px;
-moz-box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.2);
-ms-box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.2);
padding: 50px 10px 30px;
position: relative;
}
.section11 .list > li::before{
content: "";
width: 100%;
height: 20px;
background: #9d1111;
position: absolute;
left: 0;
top: 0;
}
.section11 .list > li::after{
content: "";
width: 50%;
height: 20px;
background: linear-gradient(rgba(255,255,255,0.3),rgba(255,255,255,0));
position: absolute;
right: 0;
top: 0;
}
.section11 .list > li b{
color: #cc0306;
font-weight: 900;
}
@media (max-width: 768px){
.section11{
padding: 3.0rem 0 4.0rem;
}
.section11 .title{
font-size: 2.0rem;
margin: 0 0 2.5rem;
}
.section11 .title strong{
font-size: 2.5rem;
}
.section11 .text{
font-size: 1.5rem;
margin: 0 0 2.0rem;
}
.section11 .list{
display: block;
}
.section11 .list > li{
width: 100%;
font-size: 1.3rem;
text-align: left;
line-height: 1.6;
border-radius: 0;
margin: 0 0 1.0rem;
padding: 1.0rem 0.5rem 1.0rem 2.5rem;
}
.section11 .list > li:last-child{
margin-bottom: 0;
}
.section11 .list > li::before{
width: 1.2rem;
height: 100%;
}
.section11 .list > li::after{
width: 1.2rem;
height: 50%;
left: 0;
right: auto;
top: auto;
bottom: 0;
}
}

/* -- section12 -- */
.section12{
background: #9d1111;
padding: 80px 0;
}
.section12 .title{
background: url("../img/sec12_bg_01.webp") no-repeat;
background-size: 1200px 100%;
background-position: top center;
color: #fff;
font-size: 4.0rem;
font-weight: 900;
text-align: center;
margin: 0 0 40px;
padding: 40px 0;
}
.section12 form .ttl{
text-align: center;
margin: 0 0 20px;
}
.section12 form .ttl span{
background: #9d1111;
color: #fff;
font-size: 2.8rem;
font-weight: 900;
padding: 0 30px;
display: inline-block;
position: relative;
}
.section12 form .ttl span::before{
content: "";
width: 300px;
height: 2px;
background: #fff;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
z-index: -1;
}
.section12 form .personalBlock + .ttl{
margin-top: 80px;
}
.section12 form .text{
color: #fff;
font-size: 1.8rem;
text-align: center;
margin: 0 0 40px;
}
.section12 form .personalBlock{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.section12 form .personalBlock .box{
width: 390px;
margin: 0 0 20px;
}
.section12 form .personalBlock .box:nth-of-type(1) { order: 7; }
.section12 form .personalBlock .box:nth-of-type(2) { order: 8; }
.section12 form .personalBlock .box:nth-of-type(3) { order: 10; }
.section12 form .personalBlock .box:nth-of-type(4) { order: 5; }
.section12 form .personalBlock .box:nth-of-type(5) { order: 6; }
.section12 form .personalBlock .box:nth-of-type(6) { order: 9; }
.section12 form .personalBlock .box:nth-of-type(7) { order: 2; }
.section12 form .personalBlock .box:nth-of-type(8) { order: 3; }
.section12 form .personalBlock .box:nth-of-type(9) { order: 1; }
.section12 form .personalBlock .box:nth-of-type(10) { order: 4; }
.section12 form .personalBlock .box .accBtn{
position: relative;
cursor: pointer;
}
.section12 form .personalBlock .box .accBtn::before{
content: "";
width: 23px;
height: 3px;
background: #222;
position: absolute;
right: 28px;
top: 50%;
transform: translateY(-50%);
z-index: 1;
}
.section12 form .personalBlock .box .accBtn::after{
content: "";
width: 23px;
height: 3px;
background: #222;
position: absolute;
right: 28px;
top: 50%;
transform: translateY(-50%) rotate(90deg);
z-index: 1;
opacity: 1.0;
transition: 0.5s;
}
.section12 form .personalBlock .box .accBtn.active::after{
opacity: 0;
transform: rotate(0deg);
}
.section12 form .personalBlock .box .accBtn .personalTtl{
background: #222;
color: #fff;
font-size: 2.0rem;
font-weight: 900;
text-align: center;
padding: 15px 0;
position: relative;
}
.section12 form .personalBlock .box .accBtn .personalTtl::before{
content: "";
width: 40px;
height: 40px;
background: #fff;
border-radius: 100px;
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
}
.section12 form .personalBlock .box .accBtn .personalTtl span{
color: #fff600;
font-size: 2.4rem;
}
.section12 form .personalBlock .box .personalList{
background: #fff;
border: 1px solid #222;
padding: 15px 30px;
display: none;
}
.section12 form .personalBlock .box .personalList .list > li label input{
display: none;
}
.section12 form .personalBlock .box .personalList .list > li label input + span{
font-size: 1.4rem;
padding: 12px 0 12px 35px;
display: block;
position: relative;
cursor: pointer;
}
.section12 form .personalBlock .box .personalList .list > li label input + span::before{
content: "";
width: 20px;
height: 20px;
border: 2px solid #5d5d5d;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.section12 form .personalBlock .box .personalList .list > li label input:checked + span::after{
content: "";
width: 16px;
height: 14px;
background: url("../img/sec12_ico_01.webp") no-repeat;
background-size: 100% auto;
position: absolute;
left: 4px;
top: 50%;
transform: translateY(-50%);
}
.section12 form .textarea{
width: 100%;
height: 300px;
background: #fff;
font-size: 1.6rem;
line-height: 1.6;
border: 2px solid #222;
margin: 0 0 40px;
padding: 20px;
outline: none;
resize: vertical;
}
.section12 form .nextBtn{
text-align: center;
margin: 0 0 30px;
}
.section12 form .nextBtn a{
background-image: linear-gradient(#ffc600, #e36500);
color: #fff;
font-size: 2.4rem;
font-weight: 900;
line-height: 1.0;
border-radius: 100px;
padding: 20px 160px 22px;
position: relative;
}
.section12 form .nextBtn a::before{
content: "";
width: 14px;
height: 20px;
background: #fff;
clip-path: polygon(0 0, 0% 100%, 100% 50%);
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
}
.section12 form .login{
text-align: center;
margin: 0 0 10px;
}
.section12 form .login a{
color: #fff;
font-size: 1.6rem;
text-decoration: underline;
}
.section12 form .notes{
color: #fff;
font-size: 1.2rem;
text-align: center;
}
@media (max-width: 768px){
.section12{
padding: 3.0rem 0 4.0rem;
}
.section12 .title{
background-size: auto 100%;
font-size: 2.9rem;
margin: 0 0 3.0rem;
padding: 4.5rem 0 3.5rem;
}
.section12 form .ttl{
margin: 0 0 1.5rem;
}
.section12 form .ttl span{
font-size: 2.2rem;
padding: 0 1.0rem;
}
.section12 form .ttl span::before{
width: 16.0rem;
}
.section12 form .personalBlock + .ttl{
margin-top: 2.0rem;
}
.section12 form .text{
font-size: 1.6rem;
margin: 0 0 2.0rem;
}
.section12 form .personalBlock .box{
width: 100%;
margin: 0 0 2.0rem;
}
.section12 form .personalBlock .box .accBtn::before{
width: 1.5rem;
height: 0.3rem;
right: 2.55rem;
}
.section12 form .personalBlock .box .accBtn::after{
width: 1.4rem;
height: 0.3rem;
right: 2.55rem;
}
.section12 form .personalBlock .box .accBtn .personalTtl{
font-size: 1.8rem;
padding: 1.0rem 0;
}
.section12 form .personalBlock .box .accBtn .personalTtl::before{
width: 2.5rem;
height: 2.5rem;
right: 2.0rem;
}
.section12 form .personalBlock .box .accBtn .personalTtl span{
font-size: 2.0rem;
}
.section12 form .personalBlock .box .personalList{
padding: 1.0rem 0 1.0rem 1.5rem;
}
.section12 form .personalBlock .box .personalList .list > li label input + span{
font-size: 1.4rem;
padding: 1.0rem 0 1.0rem 2.8rem;
}
.section12 form .personalBlock .box .personalList .list > li label input + span::before{
width: 1.6rem;
height: 1.6rem;
}
.section12 form .personalBlock .box .personalList .list > li label input:checked + span::after{
width: 1.3rem;
height: 1.2rem;
left: 0.4rem;
}
.section12 form .textarea{
height: 20.0rem;
font-size: 1.4rem;
border: 1px solid #222;
margin: 0 0 2.0rem;
padding: 2.0rem;
}
.section12 form .nextBtn{
margin: 0 0 2.0rem;
}
.section12 form .nextBtn a{
ont-size: 2.0rem;
padding: 2.0rem 0 2.2rem;
display: block;
}
.section12 form .nextBtn a::before{
width: 0.9rem;
height: 1.5rem;
right: 2.0rem;
}
.section12 form .login{
margin: 0 0 1.0rem;
}
.section12 form .login a{
font-size: 1.4rem;
}
.section12 form .notes{
font-size: 1.0rem;
}
}