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


/*PC*/
@media screen and (min-width: 1680px) {

.header { background: url("../images/strong/hedImg.jpg") center center no-repeat; background-size: cover;}


.contents {}
.contents .inner { width: 1536px; margin: auto; padding: 100px 0 150px;}
.contents .inner .cont01 { margin: 0 20px 100px;}
.contents .inner .cont01 ul { display: flex; flex-direction: column; gap: 70px; counter-reset: number 0;}
.contents .inner .cont01 ul li { display: flex; align-items: center; gap: 40px;}
.contents .inner .cont01 ul li .img	{ width: 420px;}
.contents .inner .cont01 ul li .img	img { border-radius: 5px;}
.contents .inner .cont01 ul li .icon { width: 120px;}
.contents .inner .cont01 ul li .icon img { }
.contents .inner .cont01 ul li .txt { }
.contents .inner .cont01 ul li .txt h3 { padding: 40px 0 10px; font-size: 30px; position: relative;}
.contents .inner .cont01 ul li .txt h3:before { counter-increment: number 01; content: counter(number, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: "Bebas Neue", sans-serif; font-size: 40px; color: var(--color01_10); font-weight: 400;}
.contents .inner .cont01 ul li .txt p { }


.contents .inner .cont02 { margin: 0 0; background: var(--color01_02); padding: 60px 80px; border-radius: 10px;}
.contents .inner .cont02 h2 { margin: 0 0 60px; position: relative;}
.contents .inner .cont02 h2::after { content: ""; position: absolute; left: 7.5em; right: 0; top: 50%; height: var(--com_px02); background: var(--color99_10); z-index: 10;}
.contents .inner .cont02 ul { display: flex; gap: 50px; flex-wrap: wrap;}
.contents .inner .cont02 ul li { width: calc( ( 100% - 100px) / 3);}
.contents .inner .cont02 ul li .img {}
.contents .inner .cont02 ul li .img img { margin-bottom: 20px;}
.contents .inner .cont02 ul li .txt {}
.contents .inner .cont02 ul li .txt h3 { font-size: 22px; margin-bottom: 10px;}
.contents .inner .cont02 ul li .txt p { font-size: 18px;}

 

}


@media print, screen and (min-width: 768px) and ( max-width: 1679px) {

.header { background: url("../images/strong/hedImg.jpg") center center no-repeat; background-size: cover;}


.contents {}
.contents .inner { width: 91.4286vw; margin: auto; padding: 5.9524vw 0 8.9286vw;}
.contents .inner .cont01 { margin: 0 1.1905vw 5.9524vw;}
.contents .inner .cont01 ul { display: flex; flex-direction: column; gap: 4.1667vw; counter-reset: number 0;}
.contents .inner .cont01 ul li { display: flex; align-items: center; gap: 2.3810vw;}
.contents .inner .cont01 ul li .img	{ width: 25.0000vw;}
.contents .inner .cont01 ul li .img	img { border-radius: 0.2976vw;}
.contents .inner .cont01 ul li .icon { width: 7.1429vw;}
.contents .inner .cont01 ul li .icon img { }
.contents .inner .cont01 ul li .txt { }
.contents .inner .cont01 ul li .txt h3 { padding: 2.3810vw 0 0.5952vw; font-size: 1.7857vw; position: relative;}
.contents .inner .cont01 ul li .txt h3:before { counter-increment: number 01; content: counter(number, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: "Bebas Neue", sans-serif; font-size: 2.3810vw; color: var(--color01_10); font-weight: 400;}
.contents .inner .cont01 ul li .txt p { }


.contents .inner .cont02 { margin: 0 0; background: var(--color01_02); padding: 3.5714vw 4.7619vw; border-radius: 0.5952vw;}
.contents .inner .cont02 h2 { margin: 0 0 3.5714vw; position: relative;}
.contents .inner .cont02 h2::after { content: ""; position: absolute; left: 7.5em; right: 0; top: 50%; height: var(--com_px02); background: var(--color99_10); z-index: 10;}
.contents .inner .cont02 ul { display: flex; gap: 2.9762vw; flex-wrap: wrap;}
.contents .inner .cont02 ul li { width: calc( ( 100% - 5.9524vw) / 3);}
.contents .inner .cont02 ul li .img {}
.contents .inner .cont02 ul li .img img { margin-bottom: 1.1905vw;}
.contents .inner .cont02 ul li .txt {}
.contents .inner .cont02 ul li .txt h3 { font-size: 1.3095vw; margin-bottom: 0.5952vw;}
.contents .inner .cont02 ul li .txt p { font-size: 1.0714vw;}

 

}



/*sp*/
@media only screen and (max-width: 767px) {

.header { background: url("../images/strong/hedImg.jpg") center center no-repeat; background-size: cover;}


.contents {}
.contents .inner { max-width: 240.0000vw; margin: auto; padding: 15.6250vw 4.6875vw 23.4375vw;}
.contents .inner .cont01 { margin: 0 3.1250vw 15.6250vw;}
.contents .inner .cont01 ul { display: flex; flex-direction: column; gap: 7.8125vw; counter-reset: number 0;}
.contents .inner .cont01 ul li { display: flex; flex-direction: column; align-items: center; gap: 4.6875vw; position: relative; padding: 0 3.1250vw 7.8125vw; border-bottom: dotted var(--com_px01) var(--color99_10);}
.contents .inner .cont01 ul li .img	{ width: 100%;}
.contents .inner .cont01 ul li .img	img { border-radius: 0.7813vw;}
.contents .inner .cont01 ul li .icon { width: 18.7500vw; position: absolute; left: 3.1250vw; bottom: 9.3750vw;}
.contents .inner .cont01 ul li .icon img { }
.contents .inner .cont01 ul li .txt { margin-left: 21.8750vw;}
.contents .inner .cont01 ul li .txt h3 { padding: 0 0 1.5625vw; font-size: 4.6875vw; position: relative; display: flex; gap: 1.5625vw; align-items: baseline;}
.contents .inner .cont01 ul li .txt h3:before { counter-increment: number 01; content: counter(number, decimal-leading-zero); /*position: absolute;*/ top: 0; left: 0; font-family: "Bebas Neue", sans-serif; font-size: 6.2500vw; color: var(--color01_10); font-weight: 400;}
.contents .inner .cont01 ul li .txt p { }


.contents .inner .cont02 { margin: 0 0; background: var(--color01_02); padding: 7.8125vw 4.6875vw; border-radius: 1.5625vw;}
.contents .inner .cont02 h2 { margin: 0 0 7.8125vw; position: relative; font-size: 4.6875vw;}
.contents .inner .cont02 h2::after { content: ""; position: absolute; left: 7.5em; right: 0; top: 50%; height: var(--com_px02); background: var(--color99_10); z-index: 10;}
.contents .inner .cont02 ul { display: flex; gap: 4.6875vw 0; flex-wrap: wrap; justify-content: space-between;}
.contents .inner .cont02 ul li { width: calc( ( 100% - 4.6875vw) / 2);}
.contents .inner .cont02 ul li .img {}
.contents .inner .cont02 ul li .img img { margin-bottom: 1.5625vw;}
.contents .inner .cont02 ul li .txt {}
.contents .inner .cont02 ul li .txt h3 { font-size: 3.1250vw; margin-bottom: 0.7813vw;}
.contents .inner .cont02 ul li .txt p { font-size: 2.5000vw;}

 

}




@media screen and (width: 640px) {

.header { background: url("../images/strong/hedImg.jpg") center center no-repeat; background-size: cover;}


.contents {}
.contents .inner { max-width: 1536px; margin: auto; padding: 100px 30px 150px;}
.contents .inner .cont01 { margin: 0 20px 100px;}
.contents .inner .cont01 ul { display: flex; flex-direction: column; gap: 50px; counter-reset: number 0;}
.contents .inner .cont01 ul li { display: flex; flex-direction: column; align-items: center; gap: 30px; position: relative; padding: 0 20px 50px; border-bottom: dotted var(--com_px01) var(--color99_10);}
.contents .inner .cont01 ul li .img	{ width: 100%;}
.contents .inner .cont01 ul li .img	img { border-radius: 5px;}
.contents .inner .cont01 ul li .icon { width: 120px; position: absolute; left: 20px; bottom: 60px;}
.contents .inner .cont01 ul li .icon img { }
.contents .inner .cont01 ul li .txt { margin-left: 140px;}
.contents .inner .cont01 ul li .txt h3 { padding: 0 0 10px; font-size: 30px; position: relative; display: flex; gap: 10px; align-items: baseline;}
.contents .inner .cont01 ul li .txt h3:before { counter-increment: number 01; content: counter(number, decimal-leading-zero); /*position: absolute;*/ top: 0; left: 0; font-family: "Bebas Neue", sans-serif; font-size: 40px; color: var(--color01_10); font-weight: 400;}
.contents .inner .cont01 ul li .txt p { }


.contents .inner .cont02 { margin: 0 0; background: var(--color01_02); padding: 50px 30px; border-radius: 10px;}
.contents .inner .cont02 h2 { margin: 0 0 50px; position: relative; font-size: 30px;}
.contents .inner .cont02 h2::after { content: ""; position: absolute; left: 7.5em; right: 0; top: 50%; height: var(--com_px02); background: var(--color99_10); z-index: 10;}
.contents .inner .cont02 ul { display: flex; gap: 30px 0; flex-wrap: wrap; justify-content: space-between;}
.contents .inner .cont02 ul li { width: calc( ( 100% - 30px) / 2);}
.contents .inner .cont02 ul li .img {}
.contents .inner .cont02 ul li .img img { margin-bottom: 10px;}
.contents .inner .cont02 ul li .txt {}
.contents .inner .cont02 ul li .txt h3 { font-size: 20px; margin-bottom: 5px;}
.contents .inner .cont02 ul li .txt p { font-size: 16px;}

 

}