/*
    support_rec.css
*/
/*
    For reset.
*/

	*{
        -webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}

	button, input, select, textarea {
		font-family : inherit;
		font-size   : 100%;
	}

/************************************** For PC. **************************************/
	div.SUPPORT_REC_WP{
		width:100%;
        border-bottom:1px solid #434343;
        margin-bottom:10px;
        line-height:1.8em;
	}

  /* ---------------------------------
      For Top Section 
    --------------------------------- */
	div.SUPPORT_REC_MAIN{
		width:100%;
		height:500px;
		background:url(../imgs/support_rec_pc.jpg) no-repeat;
		background-size: cover;
		background-position: 50% 30%;
        display:flex;
        align-items: center;
	}

	div.SUPPORT_REC_MAIN_BOX{
		width:100%;
		height:auto;
		padding:20px;
		background: rgba(0,0,0,0.4);
        color:#fff;
	}

	div.SUPPORT_REC_MAIN_BOX p{
		font-size:160%;
		margin:0;
		padding:0;
        line-height:1.5em;
        text-align:center;
        font-weight:bold;
	}

	div.SUPPORT_REC_INFO{
		width:86%;
        max-width: 1000px;
        margin:0 auto;
        padding:60px 0 40px 0;
	}

	div.SUPPORT_REC_INFO h2{
		font-size:200%;
        font-weight:bold;
        margin-bottom:40px;
        color:#000;
	}

	div.SUPPORT_REC_INFO ul{
        padding-left:40px;
        list-style-type: disc;
	}

	div.SUPPORT_REC_INFO ul li{
        margin-bottom:10px;
        list-style-type: disc;
	}

	div.SUPPORT_REC_PRICE{
		width:100%;
        max-width: 1000px;
        margin:0 auto;
	}


	div.SUPPORT_REC_PRICE_BOX_WP{
		width:100%;
        margin-bottom:40px;
        height:auto;
	}


	div.REC_BOX_TOP{
        color:#fff;
        text-align:center;
        position: relative;
        font-weight:bold;
        padding-top:6px;
        font-size:min(1.5vw,16px);
        line-height:1.8em;
	}

	div.REC_BOX_TOP p{
      position: absolute;
      top: 42%;
      left: 50%;
      transform: translate(-50%,-50%);
      font-size:120%;
      width:100%;
      padding:0 10px;
	}

	div.REC_BOX_TOP label{
        background:#fff;
        color:#F24726;
        font-size:60%;
        padding:0 4px;
	}

	div.REC_BOX_TOP p span{
      display:block;
	}

	div.REC_BOX_TOP p span:first-child{
      margin-bottom:0.4em;
	}

	div.REC_BOX_TOP p span:last-child{
      border-top:10px solid #fff;
      width:100%;
      padding-top:0.4em;
	}

	div.REC_BOX_TTL div.REC_BOX_TOP{
        background:#808080;
        height:130px;
	}

	div.REC_BOX_TBTM{
        background:#fff;
        border-left:1px solid #9f9f9f;
        border-right:1px solid #9f9f9f;
        border-bottom:1px solid #9f9f9f;
        font-size:min(1.5vw,14px);
        color:#000;
        line-height:1.4em;
        font-weight:bold;
	}

	div.REC_BOX_BTM{
        background:#fff;
        border-right:1px solid #9f9f9f;
        text-align:center;
        color:#000;
        line-height:1.4em;
        font-size:80%;
        font-weight:bold;
	}

	div.REC_BOX_LINE01{
        background:#FBF7F7;
        height:50px;
        display:flex;
        align-items:center;
        justify-content: center;
	}

	div.REC_BOX_LINE02{
        background:#fff;
        height:50px;
        display:flex;
        align-items:center;
        justify-content: center;
	}

	div.REC_BOX_TBTM div.REC_BOX_LINE02{
        justify-content: start;
        padding:0  0 0 10px;
	}

	div.REC_BOX_TBTM div.REC_BOX_LINE01{
        justify-content: start;
        padding:0  0 0 10px;
	}

	div.REC_BOX_LINE01 img, div.REC_BOX_LINE02 img{
        width:20px;
        margin:0 auto;
	}

	div.SUPPORT_REC_PRICE_BOX_SPWP{
		width:100%;
        display:flex;
        flex-wrap:wrap;
	}

	div.REC_NBOX_WP{
		width:calc(25% - 6px);
        padding:10px 5px 30px 5px;
        height:auto;
        position:relative;
        border:1px solid #41D7DD;
        margin: 0 3px 6px 3px;
        background:#fff;
	}

	div.REC_NBOX_WP2{
		width:calc(100% - 6px);
        padding:10px;
        height:auto;
        border:1px solid #41D7DD;
        margin:0 auto;
        background:#fff;
	}

	div.REC_NBOX{
	}

	div.REC_NBOX p{
        margin:0;
        padding:0;
	}

	div.REC_NBOX_WP2 div.REC_NBOX{
        display:flex;
        justify-content: space-between;
        align-items: center;
	}

	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT{
		width:23%;
	}

	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT2{
		width:50%;
	}

	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT3{
		width:23%;
	}


	div.REC_NBOX p.REC_NBOX_TTL_FREE{
        display:block;
        text-align:center;
        color:#fff;
        font-size:80%;
        background:#9747FF;
        line-height:1.6em;
        padding:3px 0;
	}

	div.REC_NBOX p.REC_NBOX_TTL_BAS{
        display:block;
        text-align:center;
        color:#fff;
        font-size:80%;
        background:#FF5F1F;
        line-height:1.6em;
        padding:3px 0;
	}

	div.REC_NBOX p.REC_NBOX_TTL_BIZ{
        display:block;
        text-align:center;
        color:#fff;
        font-size:80%;
        background:#6495ED;
        line-height:1.6em;
        padding:3px 0;
	}

	div.REC_NBOX p.REC_NBOX_TTL_ONE{
        display:block;
        text-align:center;
        color:#fff;
        font-size:80%;
        background:#FDDA0D;
        line-height:1.6em;
        padding:3px 0;
	}

	div.REC_NBOX p.REC_NBOX_TTL_INT{
        display:block;
        text-align:center;
        color:#fff;
        font-size:80%;
        background:#50C878;
        line-height:1.6em;
        padding:3px 0;
	}

	div.REC_NBOX ul{
        margin:20px 0;
        font-size:70%;
        color:#150097;
	}

	div.REC_NBOX ul li{
        margin-bottom:10px;
        display:flex;
        align-items: center;
        line-height:1.2em;
	}

	div.REC_NBOX ul li img{
        width:14px;
        margin-right:4px;
	}

	div.REC_NBOX p.REC_NBOX_TTL_PRC{
        width:100%;
        color:#999;
        text-align:center;
        font-size:70%;
        margin-top:10px;
	}

	div.REC_NBOX p.REC_NBOX_TTL_PRC span{
        font-size:160%;
        color:#150097;
        font-weight:bold;
        margin-right:5px;
	}

	div.REC_NBOX p.REC_NBOX_TTL_VAT{
        width:100%;
        display:block;
        color:#999;
        font-size:70%;
        font-weight:bold;
        text-align:center;
        line-height:1.2em;
	}

	div.REC_NBOX p.REC_NBOX_BTN{
        width:calc(100% - 20px);
        display:block;
        text-align:center;
        color:#fff;
        font-size:70%;
        background:#150097;
        position:absolute;
        bottom:10px;
        left:10px;
	}

	div.REC_NBOX p.REC_NBOX_BTN a{
        display:block;
        width:100%;
	}


	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT3 p.REC_NBOX_BTN{
        position:relative;
        bottom:0;
        left:0;
        width:100%;
        margin-top:10px;
	}

	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT2 ul{
        margin:0 ;
	}

	div.REC_NBOX div.REC_BOX_TOP{
        background:#eee;
        height:130px;
	}

	div.REC_BOX_TRIAL{
        background:#19D893;
        color:#fff;
	}

	div.REC_BOX_TRIAL div.REC_BOX_TOP{
        background:#19D893;
        height:130px;
	}

	div.REC_BOX_BASIC{
        background:#F24726;
        color:#fff;
	}

	div.REC_BOX_BASIC div.REC_BOX_TOP{
        background:#F24726;
        height:130px;
	}

	div.REC_BOX_BIZ{
        background:#2D9BF0;
        color:#fff;
	}

	div.REC_BOX_BIZ div.REC_BOX_TOP{
        background:#2D9BF0;
        height:130px;
	}

	div.REC_BOX_ECO{
        background:#FAC710;
        color:#fff;
	}

	div.REC_BOX_ECO div.REC_BOX_TOP{
        background:#FAC710;
        height:130px;
	}

	div.REC_BOX_LINK{
        color:#fff;
        text-align:center;
        font-weight:bold;
        font-size:min(1.5vw,16px);
        line-height:1.8em;
        padding:20px 0;
	}

	div.SUPPORT_REC_PRICE_BOX_ITV{
        background:#fff;
        padding:10px 20px;
        border:2px solid #6F39B8;
        display:flex;
        justify-content: space-between;
        align-items:center;
	}

	div.REC_ITVBOX_PRICE{
        width:30%;
        text-align:center;
        font-weight:bold;
        line-height:1.8em;
	}

	div.REC_ITVBOX_PRICE p{
        padding:0 20px;
        font-size:140%;
	}

	div.REC_ITVBOX_PRICE p span{
        display:block;
	}

	div.REC_ITVBOX_PRICE p span:first-child{
        margin-bottom:0.4em;
	}

	div.REC_ITVBOX_PRICE p span:last-child{
      border-top:10px solid #6F39B8;
      width:100%;
      padding-top:0.4em;
	}

	div.REC_ITVBOX_LIST{
        width:34%;
	}

	div.REC_ITVBOX_BTN{
        width:26%;
	}

	div.REC_ITVBOX_LIST ul li{
        color:#aaa;
        font-size: 84%;
        line-height:1.6em;
		background:url(../imgs/rec_yes.png) no-repeat;
		background-size: 26px 26px;
		background-position: 0 50%;
        padding-left:30px;
        font-weight:normal;
        padding-top:6px;
        padding-bottom:6px;
	}

    div.REC_ITVBOX_BTN{
        text-align:center;
        display:flex;
        flex-direction: column;
    }

    div.REC_ITVBOX_BTN a{
        display:block;
        width:80%;
        padding: 4px 10px;
        border-radius: 10px;
        font-size: 90%;
        color: #fff;
        cursor: pointer;
        font-weight:normal;
        background: #12CDD4;
        margin:0 auto;
        margin-bottom:20px;
    }

    div.REC_ITVBOX_BTN img{
        width:90%;
        height:auto;
        margin:0 auto;
    }



	p.SUPPORT_REC_PRICE_ATT{
        display:block;
		width:100%;
        padding-left: 10px;
        font-size:90%;
        font-weight:bold;
	}

/*
	div.SUPPORT_REC_PRICE_BASIC{
        color:#00B0F0;
        border:1px solid #00B0F0;
		width:32%;
        background:#fff;
        padding: 3% 1% 5% 1%;
	}

	div.SUPPORT_REC_PRICE_ECONOMY{
        color:#F19D19;
        border:1px solid #F19D19;
		width:32%;
        background:#fff;
        padding: 3% 1% 5% 1%;
	}

	div.SUPPORT_REC_PRICE_COMMI{
        color:#FF0066;
        border:1px solid #FF0066;
		width:32%;
        background:#fff;
        padding: 3% 1% 5% 1%;
	}

	div.SUPPORT_REC_PRICE_UP_BOX{
        text-align:center;
        margin-bottom:10px;
	}

	div.SUPPORT_REC_PRICE_UP_BOX p{
        padding:0;
        margin:0;
	}

	div.SUPPORT_REC_PRICE_UP_BOX span{
        color:#fff;
        width:auto;
        padding:1px 5px;
        font-size:80%;
	}

	div.SUPPORT_REC_PRICE_ECONOMY div.SUPPORT_REC_PRICE_UP_BOX span{
        background:#ED1414;
	}

	div.SUPPORT_REC_PRICE_COMMI div.SUPPORT_REC_PRICE_UP_BOX span{
        background:#FAC710;
	}

	div.SUPPORT_REC_PRICE_UP_BOX p.prc{
        font-size:180%;
        font-weight:bold;
        line-height:1.6em;
	}

	div.SUPPORT_REC_PRICE_UP_BOX p.btn{
        width:auto;
        margin:0 auto;
        margin-top:16px;
        margin-bottom:6px;
	}

	div.SUPPORT_REC_PRICE_UP_BOX p.btn a{
        padding: 10px 40px;
        border-radius: 20px;
        font-size: 90%;
        color: #fff;
        cursor: pointer;
        font-weight:normal;
	}

	div.SUPPORT_REC_PRICE_UP_BOX p.hsk{
        margin-top:10px;
        color: #ABA3A3;
        font-size: 90%;
        font-weight:bold;
	}

	div.SUPPORT_REC_PRICE_BASIC div.SUPPORT_REC_PRICE_UP_BOX p.btn a{
        background: #00B0F0;
	}

	div.SUPPORT_REC_PRICE_ECONOMY div.SUPPORT_REC_PRICE_UP_BOX p.btn a{
        background: #F19D19;
	}

	div.SUPPORT_REC_PRICE_COMMI div.SUPPORT_REC_PRICE_UP_BOX p.btn a{
        background: #FF0066;
	}

	div.SUPPORT_REC_PRICE_DWN_BOX{
        padding:0 8%;
	}

	div.SUPPORT_REC_PRICE_DWN_BOX ul li{
        color:#000;
        font-size: 80%;
        line-height:1.6em;
		background:url(../imgs/price_arr2.png) no-repeat;
		background-size: 12px 12px;
		background-position: 0 50%;
        padding-left:20px;
        padding-top:10px;
        padding-bottom:10px;
	}

*/


	div.SUPPORT_REC_INFO2{
		width:86%;
        margin:0 auto;
        padding:80px 0;
		display:flex;
        justify-content: space-between;
	}

	div.SUPPORT_REC_INFO2_IMG{
		width:40%;
        margin-top:50px;
	}

	div.SUPPORT_REC_INFO2_IMG img{
		width:100%;
		height:auto;
	}

	div.SUPPORT_REC_INFO2_TXT{
		width:50%;
	}

	div.SUPPORT_REC_INFO2_TXT h3{
		font-size:160%;
        margin-bottom:20px;
        color:#000;
	}

	div.SUPPORT_REC_INFO2_TXT p{
		margin:0;
		padding:0;
	}
    
    p.to_contact_btn{
        width:86%;
        margin:0 auto;
        text-align:center;
        display:flex;
        justify-content: center;
        margin-bottom:60px;
    }

    p.to_contact_btn a{
        display:block;
        width:200px;
        padding: 8px 40px;
        border-radius: 10px;
        font-size: 90%;
        color: #fff;
        cursor: pointer;
        font-weight:normal;
        background: #337CCF;
    }

/************************************** For SP. **************************************/
@media screen and (max-width:767px){
	div.SUPPORT_REC_WP{
        border-bottom:0;
        line-height:2.0em;
	}

	div.SUPPORT_REC_WP_TH{
		width:100%;
        margin-bottom:10px;
        border-bottom:0;
        line-height:2.0em;
        overflow-x: hidden;
	}

	div.SUPPORT_REC_SCR_TH{
		width:100%;
	}

	div.SUPPORT_REC_MAIN{
		height:400px;
		background:url(../imgs/support_rec_sp.jpg) no-repeat;
		background-size: 100% auto;
		background-position: 70% 54%;
	}

	div.SUPPORT_REC_MAIN_BOX{
		width:100%;
		padding:20px;
		height:auto;
        position:absolute;
        top:180px;
        left: 0;
		background: rgba(0,0,0,0.4);
	}

	div.SUPPORT_REC_MAIN_BOX p{
		font-size:100%;
		font-weight:bold;
		-webkit-text-stroke: 0;
		margin-bottom:0;
        text-align:center;
	}

	div.SUPPORT_REC_INFO{
		width:100%;
		padding:40px 20px;
	}

	div.SUPPORT_REC_INFO h2{
		font-size:160%;
        margin-bottom:20px;
	}

	div.SUPPORT_REC_INFO ul{
        padding-left:20px;
	}

	div.SUPPORT_REC_PRICE{
        padding:0;
        margin:0;
		width:100%;
		padding:10px 0 10px 0;
        height:auto;
		/*flex-wrap: wrap;*/
        margin-bottom:20px;
	}

	div.REC_BOX_TTL{
		width:30%;
	}

	div.SUPPORT_REC_PRICE_BOX_SPWP{
		width:100%;
        display:flex;
        align-items: stretch;
	}

	div.REC_BOX_TOP{
        font-size:100%;
	}

	div.REC_BOX_TBTM{
        font-size:80%;
	}

	div.REC_BOX_LINK{
        font-size:100%;
	}
	div.REC_BOX_TOP label{
		width:70%;
        position:absolute;
        top: 4px;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        line-height:1.5em;
	}

	div.REC_BOX_TOP label:lang(th) {
		width:90%;
	}

	div.REC_BOX_TOP p span:last-child:lang(zh){
      padding-right:14%;
      padding-left:14%;
	}


/*
	div.SUPPORT_REC_PRICE_BASIC{
        padding:0;
        margin:0;
		width:100%;
        position:static;
        height:auto;
		padding:10px 20px 30px 20px;
        margin-bottom:20px;
	}

	div.SUPPORT_REC_PRICE_ECONOMY{
        padding:0;
        margin:0;
		width:100%;
        position:static;
        height:auto;
		padding:10px 20px 30px 20px;
        transform: none;
        margin-bottom:20px;
	}

	div.SUPPORT_REC_PRICE_COMMI{
        padding:0;
        margin:0;
		width:100%;
        position:static;
        height:auto;
		padding:10px 20px 30px 20px;
        margin-bottom:20px;
	}
*/

	div.SUPPORT_REC_INFO2{
		width:100%;
		padding:40px 20px;
		flex-wrap: wrap;
	}

	div.SUPPORT_REC_INFO2_IMG{
		width:100%;
        margin-bottom:20px;
        margin-top:0;
	}

	div.SUPPORT_REC_INFO2_TXT{
		width:100%;
        margin:0;
	}

	div.SUPPORT_REC_INFO2_TXT h3{
		font-size:160%;
        margin-bottom:20px;
	}

    p.to_contact_btn{
        display:block;
        width:100%;
        text-align:center;
		padding:0 20px 40px 20px;
        margin-bottom:0;
    }

    p.to_contact_btn a{
        display:block;
        width:100%;
        padding: 10px 40px;
        border-radius: 10px;
        font-size: 90%;
        color: #fff;
        cursor: pointer;
        font-weight:normal;
        background: #337CCF;
    }

	div.SUPPORT_REC_PRICE_BOX_ITV{
		flex-wrap: wrap;
        padding:10px;
        margin-top:60px;
	}

	div.REC_ITVBOX_PRICE{
		width:50%;
        padding:0;
	}

	div.REC_ITVBOX_LIST{
		width:50%;
	}

	div.REC_ITVBOX_BTN{
		width:100%;
        flex-direction: row;
        align-items: center;
        justify-content: center;
	}

    div.REC_ITVBOX_BTN a{
        width:40%;
        margin-bottom:0;
        padding: 4px 4px;
        font-size: 80%;
    }

    div.REC_ITVBOX_BTN img{
        width:140px;
        height:auto;
        margin-left:10px;
    }

	p.SUPPORT_REC_PRICE_ATT{
		width:100%;
	}


	div.REC_NBOX_WP{
        padding:10px 10px 30px 10px;
        margin:0;
        margin:0 3px;
	}

	div.REC_NBOX_WP2{
        position:relative;
        padding:10px 10px 30px 10px;
        margin:0;
        margin:0 3px;
	}

	div.REC_NBOX_WP2 div.REC_NBOX{
        display:block;
	}

	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT{
		width:100%;
	}

	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT2{
		width:100%;
        margin-top:16px;
	}

	div.REC_NBOX_WP2 div.REC_NBOX div.REC_NBOX_FLT3{
		width:calc(100% - 20px);
        position:absolute;
        bottom:10px;
	}

	div.REC_NBOX_WP ul li{
		font-size:110%;
	}

	div.REC_NBOX_WP2 ul li{
		font-size:110%;
	}


}