@charset "UTF-8";

/*-------------------------
__top_style
-------------------------*/

#main{ background-color: #fff;}


@media screen and (min-width:1000px){
.tab_only{ display: none;}
}

@media screen and (max-width:999px){
.tab_none{ display: none;}
}

@media screen and (min-width: 768px) {
.sp_only{ display: none;}
}
    
@media screen and (max-width: 767px) {

}

/*-------------------------
__sell_title
-------------------------*/

.sell_title{ width: 100%; height: 650px; background-image: url("../images/main_back.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center; position: relative;}
.sell_title:after{ content: ''; width: 100%; height: 100%; background-image: url("../images/main_back_on.png"); background-size: auto 650px; background-position: center; background-repeat: no-repeat; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 0;}
.sell_title .inner{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin-top: 10px; z-index: 10;}
.sell_title .inner h1{ width: 667px; height: auto; margin: 0 auto 40px;}
.sell_title .inner h1 img{ width: 100%; height: auto;}
.sell_title .inner p{ width: 453px; height: auto; margin: 0 auto;}
.sell_title .inner p img{ width: 100%; height: auto;}

@media screen and (max-width:999px){
.sell_title{ height: 550px;}
.sell_title:after{ background-image: url("../images/main_back_on_tab.png"); background-size: auto 550px;}
.sell_title .inner{ margin-top: 20px;}
.sell_title .inner h1{ width: 520px;}
.sell_title .inner p{ width: 400px;}
}

@media screen and (max-width: 767px) {
.sell_title{ height: 400px; background-image: url("../images/main_back_sp.jpg");}
.sell_title:after{ background-image: url("../images/main_back_on_sp.png"); background-size: auto 400px;}
.sell_title .inner{ width: 100%; margin-top: 20px;}
.sell_title .inner h1{ width: calc(100% - 100px); max-width: 340px; margin: 0 auto 20px;}
.sell_title .inner p{ width:65%; max-width: 280px;}
}

/*-------------------------
__point01
-------------------------*/

#point01_box{ padding-top: 40px; box-sizing: border-box;}
#point01_box .block_inner{ max-width: 100%!important; background-image: url(../images/point01_back.jpg); background-size: contain; background-position: center bottom; background-repeat: no-repeat;}
#point01_box .basic_h2{ position: relative; padding-left: 100px; display: inline-block; margin-bottom: 40px;}
#point01_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point01@2x.png); background-size: 70px 94px;}
#point01_box p{ margin-bottom: 40px;}
#point01_box .point01_btm{ display: flex; justify-content: center; align-items: center;}
#point01_box .point01_btm .staff_image{ width: 308px; height: 387px;}
#point01_box .point01_btm .staff_image img{ width: 100%; height: auto;}
#point01_box .point01_btm .award{ width: 265px; height: 320px;}
#point01_box .point01_btm .award img{ width: 100%; height: auto;}

#point01_2_box{ padding: 80px 0; box-sizing: border-box;}
#point01_2_box h3{ background-color: #16673A; padding: 20px 50px 20px 50px; clip-path: polygon(3% 0, 100% 0, 97% 100%, 0 100%); margin-bottom: 30px;}
.yellow_line{ color: #16673A; font-size: 2.7em; line-height: 1.5; font-weight: 700; margin-bottom: 20px;}
.yellow_line span{ background: linear-gradient(transparent 60%, #FDF228 0%); padding: 0 1px 0px;}
#point01_2_box .inbox{ margin-bottom: 30px;}
#point01_2_box .sell_pic{ display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 40px;}
#point01_2_box .sell_pic p:nth-child(1){ width: 72%; height: auto;}
#point01_2_box .sell_pic p:nth-child(2){ width: 25%; height: auto;}
#point01_2_box .sell_pic p img{ width: 100%; height: auto;}
#point01_2_box .point01_bottom{ margin-top: 50px;}
#point01_2_box .point01_bottom p{ font-size: 3em!important; font-weight: 700; margin: 0 auto; text-align: center; margin-bottom: 30px;}
#point01_2_box .point01_bottom p span{ position: relative; display: inline-block;}
#point01_2_box .point01_bottom p span:before,
#point01_2_box .point01_bottom p span:after{ content: ''; width: 35px; height: 56px; background-image: url(../images/point01_06@2x.png); background-size: cover; position: absolute; top: 0;}
#point01_2_box .point01_bottom p span:before{ left: -50px;}
#point01_2_box .point01_bottom p span:after{ right: -50px; transform: scale(-1, 1);}
#point01_2_box .point01_bottom img{ width: 100%; height: auto; display: inline-block; margin-bottom: 30px;}
#point01_2_box .point01_bottom a{ display: inline-block; font-size: 2em; color: #16673A; font-weight: 700; border: 2px solid #16673A; box-sizing: border-box; border-radius: 50vh; padding: 20px 30px;}

@media screen and (max-width:999px){
#point01_box .basic_h2{ padding-left: 80px; margin-bottom: 30px;}
#point01_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point01_box .point01_btm .staff_image{ width: 250px; height: auto;}
#point01_box .point01_btm .award{ width: 230px; height: auto;}

#point01_2_box{ padding: 60px 0;}
#point01_2_box h3 img{ width: 550px; height: auto;}
.yellow_line{ font-size: 2.4em; margin-bottom: 15px;}
#point01_2_box .sell_pic{ margin-bottom: 30px;}
#point01_2_box .point01_bottom{ margin-top: 30px;}
#point01_2_box .point01_bottom p{ font-size: 2.4em!important;}
#point01_2_box .point01_bottom p span:before,
#point01_2_box .point01_bottom p span:after{ width: 25px; height: 40px;}
#point01_2_box .point01_bottom p span:before{ left: -35px;}
#point01_2_box .point01_bottom p span:after{ right: -35px;}
}

@media screen and (min-width: 768px) {
#point01_2_box .point01_bottom a{ -webkit-transition: .2s; -ms-transition: .2s; transition: .2s;}
#point01_2_box .point01_bottom a:hover{ background-color: #16673A; color: #fff;}
}

@media screen and (max-width: 767px) {
#point01_box{ padding-top: 20px;}
#point01_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point01_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point01_box p{ margin-bottom: 30px;}
#point01_box .point01_btm .staff_image,
#point01_box .point01_btm .award{ max-width: 250px; width: 45%;}

#point01_2_box{ padding: 40px 0;}
#point01_2_box h3{ padding: 15px 25px 15px 25px; margin-bottom: 20px;}
#point01_2_box h3 img{ width: 100%; max-width: 350px;}
.yellow_line{ font-size: 1.8em; line-height: 1.4; margin-bottom: 10px;}
#point01_2_box .inbox{ margin-bottom: 20px;}
#point01_2_box .sell_pic{ display: block; margin-bottom: 20px;}
#point01_2_box .sell_pic p:nth-child(1){ width: 100%; margin-bottom: 10px;}
#point01_2_box .sell_pic p:nth-child(2){ width: 180px; margin: 0 auto;}
#point01_2_box .point01_bottom p{ font-size: 1.6em!important; line-height: 1.4!important; margin-bottom: 15px;}
#point01_2_box .point01_bottom p span:before,
#point01_2_box .point01_bottom p span:after{ top: 10px;}
#point01_2_box .point01_bottom img{ margin-bottom: 15px;}
#point01_2_box .point01_bottom a{ font-size: 1.5em; padding: 15px 20px;}
}

/*-------------------------
__point02
-------------------------*/

#point02_box{ background-color: #F4F7E9; padding: 80px 0; box-sizing: border-box;}
#point02_box .basic_h2{ position: relative; padding-left: 100px; display: inline-block; margin-bottom: 40px; vertical-align: middle;}
#point02_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point02@2x.png); background-size: 70px 94px;}
#point02_box .basic_h2 img{ vertical-align: middle;}
#point02_box .ss_box{ margin: 50px auto;}
#point02_box .ss_box img{ width: 100%; height: auto;}
#point02_box .ss_box .ss_top{ display: flex; justify-content: space-between; margin-bottom: 20px;}
#point02_box .ss_box .ss_top .ss_top_left{ width: calc(50% - 10px); border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point02_box .ss_box .ss_top .ss_top_right{ width: calc(50% - 10px);}
#point02_box .ss_box .ss_top .ss_top_right ul{}
#point02_box .ss_box .ss_top .ss_top_right ul li{ border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point02_box .ss_box .ss_top .ss_top_right ul li:nth-child(1){ margin-bottom: 20px;}
#point02_box .ss_box .ss_btm{}
#point02_box .ss_box .ss_btm ul{ display: flex; justify-content: space-between;}
#point02_box .ss_box .ss_btm ul li{ width: calc(50% - 10px); border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point02_box .point02_bottom{ text-align: center; margin: 0 auto;}


@media screen and (max-width:999px){
#point02_box .basic_h2{ padding-left: 80px; margin-bottom: 30px;}
#point02_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point02_box{ padding: 60px 0;}
#point02_box .ss_box{ margin: 30px auto;}
}

@media screen and (max-width: 767px) {
#point02_box{ padding: 40px 0;}
#point02_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point02_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point02_box .basic_h2 img{ width: 160px; height: auto;}
#point02_box .ss_box{ margin: 20px auto;}
#point02_box .ss_box .ss_top{ margin-bottom: 10px;}
#point02_box .ss_box .ss_top .ss_top_left{ width: calc(50% - 5px);}
#point02_box .ss_box .ss_top .ss_top_right{ width: calc(50% - 5px);}
#point02_box .ss_box .ss_top .ss_top_right ul li:nth-child(1){ margin-bottom: 10px;}
#point02_box .ss_box .ss_btm ul li{ width: calc(50% - 5px);}
#point02_box .point02_bottom{ width: 80%; height: auto;}
#point02_box .point02_bottom img{ width: 100%; height: auto;}
}

/*-------------------------
__point03
-------------------------*/

#point03_box{ padding: 80px 0 120px; box-sizing: border-box;}
#point03_box .block_inner{ position: relative;}
#point03_box .basic_h2{ position: relative; padding-left: 90px; display: inline-block; margin-bottom: 40px;}
#point03_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point03@2x.png); background-size: 70px 94px;}
#point03_box .ss_box{ display: flex; justify-content: space-between; margin-top: 50px;}
#point03_box .ss_box img{ width: 100%; height: auto;}
#point03_box .ss_box .ss_left{ width: 100%;}
#point03_box .ss_box .ss_left p{ border: 1px solid #ddd; background-color: #fff; box-sizing: border-box; margin-bottom: 20px;}
#point03_box .ss_box .ss_left ul{ display: flex; justify-content: space-between; flex-wrap: wrap;}
#point03_box .ss_box .ss_left ul li{ width: calc(50% - 15px); justify-content: space-between; border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point03_box .ss_box .ss_left ul li:nth-child(1),
#point03_box .ss_box .ss_left ul li:nth-child(2){ margin-bottom: 30px;}
#point03_box .ss_box .ss_right{ width: calc(37% - 10px); border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point03_box .illust_box{ position: absolute; bottom: -80px; right: 100px;}

@media screen and (max-width:999px){
#point03_box{ padding: 60px 0 120px;}
#point03_box .basic_h2{ padding-left: 70px; margin-bottom: 30px;}
#point03_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point03_box .ss_box{ margin-top: 30px;}
}

@media screen and (max-width: 767px) {
#point03_box{ padding: 40px 0 60px;}
#point03_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point03_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point03_box .ss_box{ margin-top: 20px;}
#point03_box .ss_box .ss_left{ width: 100%;}
#point03_box .ss_box .ss_left p{ margin-bottom: 10px;}
#point03_box .ss_box .ss_left ul li{ width: calc(50% - 5px); margin-bottom: 10px;}
#point03_box .ss_box .ss_left ul li:nth-child(1),
#point03_box .ss_box .ss_left ul li:nth-child(2){ margin-bottom: 10px;}
#point03_box .ss_box .ss_right{ width: calc(37% - 5px);}
#point03_box .illust_box{ width: 150px; height: auto; bottom: -30px; right: 30px;}
#point03_box .illust_box img{ width: 100%; height: auto;}
}

/*-------------------------
__point04
-------------------------*/

#point04_box{ background-color: #F4F7E9; padding: 80px 0; box-sizing: border-box;}
#point04_box .basic_h2{ position: relative; padding-left: 90px; display: inline-block; margin-bottom: 40px;}
#point04_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point04@2x.png); background-size: 70px 94px;}
#point04_box .ss_box{ margin-top: 50px;}
#point04_box .ss_box h3{ margin-bottom: 20px;}
#point04_box .ss_box img{ width: 100%; height: auto;}

@media screen and (max-width:999px){
#point04_box{ padding: 60px 0;}
#point04_box .basic_h2{ padding-left: 70px; margin-bottom: 30px;}
#point04_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point04_box .ss_box{ margin-top: 30px;}
}

@media screen and (max-width: 767px) {
#point04_box{ padding: 40px 0;}
#point04_box .basic_h2{ padding-left: 45px; margin-bottom: 20px;}
#point04_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point04_box .ss_box{ margin-top: 20px;}
#point04_box .ss_box h3{ margin-bottom: 10px;}
}

/*-------------------------
__point05
-------------------------*/

#point05_box{ padding: 80px 0; box-sizing: border-box;}
#point05_box .basic_h2{ position: relative; padding-left: 90px; display: inline-block; margin-bottom: 40px;}
#point05_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point05@2x.png); background-size: 70px 94px;}
#point05_box .point_box{ display: flex; justify-content: center; align-items: center; margin-bottom: 40px;}
#point05_box .point_box .illust_box{ margin-right: 30px;}
#point05_box .point_box .illust_box img{}
#point05_box .point_box .yellow_line{ color: #16673A; font-size: 2.7em; line-height: 1.5; font-weight: 700; margin-bottom: 20px;}
#point05_box .point_box .yellow_line span{ background: linear-gradient(transparent 60%, #FDF228 0%); padding: 0 1px 0px;}
#point05_box .ss_box{}
#point05_box .ss_box img{ width: 100%; height: auto;}
#point05_box .ss_box ul{ display: flex; justify-content: space-between;}
#point05_box .ss_box ul li{ border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point05_box .ss_box ul li:nth-child(1){ width: calc(36% - 10px);}
#point05_box .ss_box ul li:nth-child(2){ width: calc(64% - 10px);}

@media screen and (max-width:999px){
#point05_box{ padding: 60px 0;}
#point05_box .basic_h2{ padding-left: 70px; margin-bottom: 30px;}
#point05_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point05_box .point_box{ margin-bottom: 30px;}
#point05_box .point_box .illust_box{ width: 120px; height: auto; margin-right: 20px;}
#point05_box .point_box .illust_box img{ width: 100%; height: auto;}
#point05_box .point_box .yellow_line{ font-size: 2.4em;}
}

@media screen and (max-width: 767px) {
#point05_box{ padding: 40px 0;}
#point05_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point05_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point05_box .point_box{ margin-bottom: 10px; margin-top: 10px;}
#point05_box .point_box .illust_box{ width: 100px;}
#point05_box .point_box .yellow_line{ font-size: 1.8em;}
#point05_box .ss_box ul li:nth-child(1){ width: calc(36% - 5px);}
#point05_box .ss_box ul li:nth-child(2){ width: calc(64% - 5px);}
}

/*-------------------------
__point06
-------------------------*/

#point06_box{ background-color: #F4F7E9; padding: 80px 0 120px; box-sizing: border-box;}
#point06_box .block_inner{ position: relative;}
#point06_box .basic_h2{ position: relative; padding-left: 100px; display: inline-block; margin-bottom: 40px; vertical-align: middle;}
#point06_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point06@2x.png); background-size: 70px 94px;}
#point06_box .basic_h2 img{ vertical-align: middle;}
#point06_box .ss_box{ margin-top: 50px;}
#point06_box .ss_box img{ width: 100%; height: auto;}
#point06_box .ss_box ul{ display: flex; justify-content: space-between;}
#point06_box .ss_box ul li{ border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point06_box .ss_box ul li:nth-child(1){ width: calc(45% - 10px);}
#point06_box .ss_box ul li:nth-child(2){ width: calc(55% - 10px);}
#point06_box .illust_box{ position: absolute; bottom: -80px; right: 100px;}

@media screen and (max-width:999px){
#point06_box{ padding: 60px 0 100px;}
#point06_box .basic_h2{ padding-left: 80px; margin-bottom: 30px;}
#point06_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point06_box .ss_box{ margin-top: 30px;}
#point06_box .illust_box{ width: 180px; height: auto; bottom: -50px; right: 50px;}
#point06_box .illust_box img{ width: 100%; height: auto;}
}

@media screen and (max-width: 767px) {
#point06_box{ padding: 40px 0 60px;}
#point06_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point06_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point06_box .basic_h2 img{ width: 150px; height: auto;}
#point06_box .ss_box{ margin-top: 20px;}
#point06_box .ss_box ul li:nth-child(1){ width: calc(45% - 5px);}
#point06_box .ss_box ul li:nth-child(2){ width: calc(55% - 5px);}
#point06_box .illust_box{ width: 140px; height: auto; bottom: -40px; right: 20px;}
}

/*-------------------------
__point07
-------------------------*/

#point07_box{ padding: 80px 0; box-sizing: border-box;}
#point07_box .basic_h2{ position: relative; padding-left: 90px; display: inline-block; margin-bottom: 40px;}
#point07_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point07@2x.png); background-size: 70px 94px;}
#point07_box .ss_box{ margin-top: 50px;}
#point07_box .ss_box img{ width: 100%; height: auto;}

@media screen and (max-width:999px){
#point07_box{ padding: 60px 0;}
#point07_box .basic_h2{ padding-left: 70px; margin-bottom: 30px;}
#point07_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point07_box .ss_box{ margin-top: 40px;}
}

@media screen and (max-width: 767px) {
#point07_box{ padding: 40px 0;}
#point07_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point07_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point07_box .ss_box{ margin-top: 20px;}
}

/*-------------------------
__point08
-------------------------*/

#point08_box{ background-color: #F4F7E9; padding: 80px 0 100px; box-sizing: border-box;}
#point08_box .block_inner{ position: relative;}
#point08_box .basic_h2{ position: relative; padding-left: 90px; display: inline-block; margin-bottom: 40px;}
#point08_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point08@2x.png); background-size: 70px 94px;}
#point08_box .ss_box{ margin-top: 50px;}
#point08_box .ss_box img{ width: 100%; height: auto;}
#point08_box .illust_box{ position: absolute; bottom: -40px; left: 100px;}

@media screen and (max-width:999px){
#point08_box{ padding: 60px 0;}
#point08_box .basic_h2{ padding-left: 70px; margin-bottom: 30px;}
#point08_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point08_box .ss_box{ margin-top: 40px;}
#point08_box .illust_box{ bottom: -20px; left: 50px; width: 100px;}
#point08_box .illust_box img{ width: 100%; height: auto;}
}

@media screen and (max-width: 767px) {
#point08_box{ padding: 40px 0;}
#point08_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point08_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point08_box .ss_box{ margin-top: 20px;}
#point08_box .illust_box{ bottom: 0; left: 20px; width: 80px;}
}

/*-------------------------
__point09
-------------------------*/

#point09_box{ padding: 80px 0; box-sizing: border-box;}
#point09_box .basic_h2{ position: relative; padding-left: 90px; display: inline-block; margin-bottom: 40px;}
#point09_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point09@2x.png); background-size: 70px 94px;}
#point09_box .ss_box{ margin: 50px auto 20px;}
#point09_box .ss_box img{ width: 100%; height: auto;}
#point09_box .ss_box ul{ display: flex; justify-content: space-between;}
#point09_box .ss_box ul li{ border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point09_box .ss_box ul li:nth-child(1),
#point09_box .ss_box ul li:nth-child(2){ width: calc(50% - 10px);}
#point09_box .point_box{}
#point09_box .point_box img{ max-width: 777px; width: 100%; height: auto;}

@media screen and (max-width:999px){
#point09_box{ padding: 60px 0;}
#point09_box .basic_h2{ padding-left: 70px; margin-bottom: 30px;}
#point09_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
}

@media screen and (max-width: 767px) {
#point09_box{ padding: 40px 0;}
#point09_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point09_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point09_box .ss_box{ margin: 20px auto 10px;}
#point09_box .ss_box ul li:nth-child(1),
#point09_box .ss_box ul li:nth-child(2){ width: calc(50% - 5px);}
}

/*-------------------------
__point10
-------------------------*/

#point10_box{ background-color: #F4F7E9; padding: 80px 0; box-sizing: border-box;}
#point10_box .basic_h2{ position: relative; padding-left: 100px; display: inline-block; margin-bottom: 40px; vertical-align: middle;}
#point10_box .basic_h2:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 70px; height: 94px; background: url(../images/point10@2x.png); background-size: 70px 94px;}
#point10_box .basic_h2 img{ vertical-align: middle;}
#point10_box .illust_box{ margin: 30px auto 60px;}
#point10_box .illust_box img{}
#point10_box .ss_box{ margin-top: 40px;}
#point10_box .ss_box h3{ margin-bottom: 20px;}
#point10_box .ss_box img{ width: 100%; height: auto;}
#point10_box .ss_box .ss_box_pic{ display: flex; align-items: center;}
#point10_box .ss_box .ss_box_pic ul{ display: flex; justify-content: space-between; align-items: center; width: 80%;}
#point10_box .ss_box .ss_box_pic ul li{ width: calc(50% - 10px); height: auto; border: 1px solid #ddd; background-color: #fff; box-sizing: border-box;}
#point10_box .ss_box .ss_box_pic p{ width: calc(20% - 20px); margin-left: 20px;}

@media screen and (max-width:999px){
#point10_box{ padding: 60px 0;}
#point10_box .basic_h2{ padding-left: 70px; margin-bottom: 30px;}
#point10_box .basic_h2:before{ width: 54px; height: 73px; background-size: 54px 73px;}
#point10_box .illust_box{ margin: 20px auto 40px; width: 220px; height: auto;}
#point10_box .illust_box img{ width: 100%; height: auto;}
}

@media screen and (max-width: 767px) {
#point10_box{ padding: 40px 0;}
#point10_box .basic_h2{ padding-left: 55px; margin-bottom: 20px;}
#point10_box .basic_h2:before{ width: 40px; height: 54px; background-size: 40px 54px;}
#point10_box .basic_h2 img{ width: 170px; height: auto;}
#point10_box .ss_box{ margin-top: 20px;}
#point10_box .ss_box h3{ margin-bottom: 10px;}
#point10_box .ss_box .ss_box_pic{ display: block;}
#point10_box .ss_box .ss_box_pic ul{ width: 100%; margin-bottom: 10px;}
#point10_box .ss_box .ss_box_pic ul li{ width: calc(50% - 5px);}
#point10_box .ss_box .ss_box_pic p{ width: 70%; max-width: 320px; margin: 0 auto;}

}

/*-------------------------
__assessment
-------------------------*/

#assessment{ background-image: url(../images/contact_back.jpg); background-size: cover; background-repeat: no-repeat;}
#assessment .assessment_inner{ padding: 80px 50px; box-sizing: border-box;}
#assessment .assessment_inner h2{ font-size: 5.3em; line-height: 1.2; font-weight: 700; color: #fff; margin-bottom: 50px;}
#assessment .assessment_inner h2 span{ color: #FDF228;}
#assessment .assessment_inner p{ font-size: 1.8em; line-height: 1.7; color: #fff; font-weight: 700; margin-bottom: 50px;}
#assessment .assessment_inner .assessment_link{}
#assessment .assessment_inner .assessment_link a{ display: inline-block; background-color: rgba(255,255,255,0.4); font-size: 3.3em; color: #16673A; font-weight: 700; padding: 55px 90px; box-sizing: border-box; border-radius: 50vh; position: relative; z-index: 10;}
#assessment .assessment_inner .assessment_link a:before{ content: ''; display: block; width: calc(100% - 20px); height: calc(100% - 20px); background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50vh; z-index: -1;}
#assessment .assessment_inner .assessment_link a > span{ display: inline-block; position: relative; padding-left: 60px;}
#assessment .assessment_inner .assessment_link a > span:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 38px; height: 38px; background-image: url(../images/assessment_icon@2x.png); background-size: 38px 38px; background-repeat: no-repeat;}
#assessment .assessment_inner .assessment_link a > span span.red{ color: #FF3200;}

#footer .inner{ padding: 80px 50px 170px!important;}
.fix_btn{ position: fixed; right: 30px; bottom: 30px; z-index: 100; width: 440px; height: 131px;}
.fix_btn a{ display: block; width: 100%; height: auto;}
.fix_btn a img{ width: 100%; height: auto;}

@media screen and (max-width:999px){
#assessment .assessment_inner{ padding: 60px 50px;}
#assessment .assessment_inner h2{ font-size: 3.7em; margin-bottom: 30px;}
#assessment .assessment_inner p{ margin-bottom: 30px;}
#assessment .assessment_inner .assessment_link a{ font-size: 2.8em; padding: 50px 80px;}
#assessment .assessment_inner .assessment_link a > span{ padding-left: 50px;}
.fix_btn{ width: 360px; height: auto;}
}

@media screen and (min-width: 768px) {
#assessment .assessment_inner .assessment_link a,
#assessment .assessment_inner .assessment_link a:before{ -webkit-transition: .2s; -ms-transition: .2s; transition: .2s;}
#assessment .assessment_inner .assessment_link a:hover{ background-color: rgba(253, 242, 40, 0.4);}
#assessment .assessment_inner .assessment_link a:hover:before{ background-color: #FDF228;}
#footer .inner{ padding: 60px 50px 150px!important;}
.fix_btn a img{ transition: filter 0.1s ease; filter: brightness(1.0);}
.fix_btn a:hover img{ filter: brightness(1.20);}
}

@media screen and (max-width: 767px) {
#footer .inner{ padding: 40px 20px 120px!important;}
#assessment .assessment_inner{ padding: 40px 20px;}
#assessment .assessment_inner h2{ font-size: 3em; margin-bottom: 20px;}
#assessment .assessment_inner p{ font-size: 1.4em; margin-bottom: 20px;}
#assessment .assessment_inner .assessment_link a{ width: 100%; font-size: 2.6em; line-height: 1.2; padding: 35px 30px;}
.fix_btn{ right: 20px; bottom: 20px; width: calc(100% - 40px); max-width: 640px;}
}