@charset "UTF-8";
/* CSS Document */
.page_method{text-align: center;padding-bottom: 80px;background: url("../method/images/bg.png") repeat}
.page_method .main_mv{width: 76%;margin: 0 auto 30px}
.page_method .main_mv img{width: 100%;height: auto}

@media screen and (max-width: 768px) {/*スマホのスタイル*/
}

.relative{position: relative;z-index: 1}
.page_method .index{text-align: left;position: relative;padding-bottom: 80px}
.page_method .index dl{margin-top: 80px}
.page_method .index dt{width: 50%;text-align: left;position: relative}
.page_method .index dd{flex: 1;margin-right: calc(50% - 50vw);min-height: 660px}
.page_method .index dd img{object-fit: cover;min-height: 660px;object-position: 100% 0}

.page_method .index .re{flex-flow: row-reverse;}
.page_method .index .re dd{flex: 1;margin-left: calc(50% - 50vw);margin-right: 0px;}
.page_method .index .re .box{padding-left: 30px; padding-right: 0px;margin-top: 20px}

.page_method .index dt .box{padding-right: 30px;margin-top: 20px}
.page_method .index dt h4{position: relative; color: #f08329;font-size: 3.1rem;font-weight: bold;letter-spacing: 0.1em;}
.page_method .index dt .copy{margin: 20px 0}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_method .index dd{-webkit-box-ordinal-group:1;-ms-flex-order:1;-webkit-order:1;order:1;}
.page_method .index dt{-webkit-box-ordinal-group:2;-ms-flex-order:2;-webkit-order:2;order:2;}
.page_method .index .re dd{flex: auto;margin-left: 0;margin-right: 0px;}
.page_method .index .re{flex-flow:column;}
.page_method .index dt{width: 100%;}
.page_method .index dd{flex:auto;margin-right: 0;min-height:auto;width: 100%}
.page_method .index dd img{min-height: auto;}
.page_method .index dt .box{padding: 0 20px 20px}
.page_method .index dt h4{font-size: 2.2rem;}
}


.page_method .index .method_1 dt h4{ color: #f08329;}
.page_method .index .method_1 dt .logo{text-align: right}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_method .index .method_1 dt .logo{width: 40%;margin-left: auto}
}

.page_method .index .method_2 dt h4{ color: #ec6b54;}
.page_method .index .img1{width: 65%;margin-left: auto;margin-top: -120px;position: relative}
.page_method .index .img1 p{position: absolute;left: 40%;bottom: 40px;}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_method .index .img1{width: 90%;margin:0  auto;position: relative}
.page_method .index .img1 p{position: static;left: 0%;bottom: 0px;}
}

.page_method .index .method_3 dt h4{ color: #0090ab;}
.page_method .index .method_3 dt .copy img{width: 40%; float: right;margin-left: 20px;margin-bottom: 20px}

.page_method .index .method_4 dt h4{ color: #37af52}
.page_method .index .img2{width: 63%;margin-left: auto;margin-top: -240px;position: relative}
.page_method .index h5{ color: #37af52;font-size: 1.6rem;font-weight: bold}
.page_method .index .kougai{margin-top: 70px}
.page_method .index .kougai .ph{width: 60%}
.page_method .index .kougai .txt{width: 40%}
.page_method .index .kougai .txt h5{border-bottom: 1px solid #37af52;padding-left: 20px}
.page_method .index .kougai .txt  p{padding-left: 20px}

@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_method .index .img2{width: 90%;margin: 20px auto 0;position: relative}
.page_method .index .kougai{margin-top: 40px}
.page_method .index .kougai .col2{width: 90%;margin: auto}
.page_method .index .kougai .ph{width: 100%;margin-top: 20px;}
.page_method .index .kougai .txt{width: 100%;}
.page_method .index .kougai .txt h5{padding-left: 0px;margin-top: 11px}
.page_method .index .kougai .txt  p{padding-left: 0px}

}


.page_method .pickup{background: #ffe03b;position: relative;text-align: center;padding: 120px 0}
.page_method .pickup::before{content: "";width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: url("../images/pickup_top.png") no-repeat center top;background-size: 100% auto}
.page_method .pickup::after{content: "";width: 100%;height: 100%;position: absolute;left: 0;bottom: 0;background: url("../images/pickup_bottom.png") no-repeat center bottom;background-size: 100% auto}

.page_method .pickup dl{margin-top: 60px;position: relative;padding-top: 100px}
.page_method .pickup dt{position: absolute;left: 0;right: 0;top: 0}
.page_method .pickup .sec1 li{margin-bottom: 20px;}
.page_method .pickup .sec1 li p{text-align: left;margin-top: 12px;}

.page_method .pickup .sec2 dd{position: relative;z-index: -1}
.page_method .pickup .sec2 li{margin-right: 30px}
.page_method .pickup .sec2 .img{width: 26%;position: absolute;right: 0;top:40%}
.page_method .pickup .sec2 p{text-align: left;margin-top: 12px;}

.page_method .pickup dl.sec3,
.page_method .pickup dl.sec4{padding-top: 60px}
.page_method .pickup .sec3 dt,
.page_method .pickup .sec4 dt{position: static;}
.page_method .pickup .txt{padding: 30px 0;text-align: left}

.page_method .pickup .sec4 li{margin-bottom: 20px;}
.page_method .pickup .sec4 p{text-align: left;margin-top: 12px;}

@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_method .pickup{padding: 60px 0}
.page_method .pickup dl{margin-top: 40px;position: relative;padding-top: 70px}
.page_method .pickup .sec1 .col2{width: 100%}
.page_method .pickup .sec1 .col3,
.page_method .pickup .sec1 .col3_2{width: 48%}
.page_method .pickup .sec2 ul{justify-content: space-between;-webkit-justify-content: space-between;}
.page_method .pickup .sec2 .col40{width: 48%;margin-right: 0px}
.page_method .pickup dl.sec3,
.page_method .pickup dl.sec4{padding-top: 30px}
.page_method .pickup .sec3 li{width: 48%;}
.page_method .pickup .txt{padding: 10px 0 20px;text-align: left}
.page_method .pickup .sec4 .col3{width: 48%}
}