@charset 'utf-8';


	

	#hd .w1200 {max-width: 1200px; }

	#hd .hd_mobile-on,
	#hd .hd_480on,
	#hd .hd_1024-on {display: none;}



/* ---------- COMPARE -------- */
	#hd #hd_compare{
		padding:160px 0;
		background: url(../img/bg/bg-compare.jpg) center center no-repeat;
		background-size: cover;
	}
    #hd #hd_compare h3.txt-blue {
    color: #3fd6ff!important;
    font-weight: 400;
	font-size: 28px!important;
    line-height: 1em!important;
    letter-spacing: 1px;
    margin: 20px 0;
    }
	#hd #hd_compare .hd_table{
		width: 100%;
		border:0;
	}
	#hd #hd_compare .hd_table li > div{
		display: inline-block;
		vertical-align: top;
		font-weight: 300;
		width: calc((100% - 200px) / 2);
		padding:0 10px 5px 10px;
		margin-left: -5px;
		position: relative;
	}
	#hd #hd_compare .hd_table li > div img:first-child{
		display: inline;
		margin:0 -40px;
	}
	#hd #hd_compare .hd_table li > div:nth-child(1){
		text-align: right;
	}
	#hd #hd_compare .hd_table li > div:nth-child(2){
		width: 200px;
		text-align: center;
		color:#3fd6ff;
		margin-top: -10px;
	}
	#hd #hd_compare .hd_table li:not(:first-child) > div:nth-child(2):after{
		content:'';
		display: block;
		background: url(../img/icon/dot.png) center top no-repeat;
		width: 100%;
		height: 50px;
		margin-top: -15px;
	}
	#hd #hd_compare .hd_table li > div:nth-child(3){
		text-align: left;
		color:#939393;
	}
	#hd_cup {
		position: absolute;
		right: 300px;
		bottom: 25px;
	}

/* ---------- RWD ---------- */

@media screen and (max-width: 1024px) {

	#hd #hd_compare h2 + p{margin-bottom: 0;}
	#hd #hd_compare .hd_table li > div:nth-child(2){width: 140px;}
	#hd #hd_compare .hd_table li > div{width:calc((100% - 140px) / 2);}
	
@media screen and (max-width: 768px) {


	#hd #hd_compare{padding-bottom: 50px;}
	#hd #hd_compare .hd_table li{margin-bottom: 10px;}
	#hd #hd_compare .hd_table li > div:nth-child(2){
		width: 125px;
		padding:0 5px 5px;
	}
	#hd #hd_compare .hd_table li > div{
		width:calc((100% - 125px) / 2);
	}
	

	#hd #hd_setup li{
		width: 100%;
		margin-left: 0;
		margin-top: 10px;
	}
	#hd #hd_setup img{
		display: inline-block;
		vertical-align: top;
		width: 20%;
	}
	#hd #hd_setup .hd_content{
		display: inline-block;
		vertical-align: top;
		width: 80%;
		margin-left: -5px;
		padding-right: 0;
	}
	#hd #hd_setup li:after{
		width: 30px;
		height: 30px;
		left: 10%;
		top: auto;
		bottom:-10px;
		-webkit-transform: rotate(90deg);
		   -moz-transform: rotate(90deg);
		    -ms-transform: rotate(90deg);
		     -o-transform: rotate(90deg);
		        transform: rotate(90deg);
	}
	#hd #hd_model .hd_models li{width: 50%;}
}
@media screen and (max-width: 620px) {
	#fp-nav{display: none;}
	#hd h1.maintitle,
	#hd h2{font-size: 34px;}
	#hd h3{font-size: 22px;}
	#hd p{font-size: 16px;line-height: 1.25rem;}
	#hd #hd_kv{padding-top: 45%;}
	#hd #hd_kv h1.subtitle{font-size: 24px; line-height: 1em;}

	#hd #hd_menu .cf{width: 100%;}

	#hd #hd_about{padding-top: 50px;}
	#hd #hd_about h2 span{display: block;margin:0 auto 20px;position: relative;}
	#hd #hd_about h2{padding-left: 0;}
	#hd #hd_about img{
		max-width: none !important;
		width: 120%;
		margin-left: -10%;
	}

	#hd #hd_compare{padding-bottom: 50px;}
	#hd_cup{
		width: 35px;
		bottom: 70px;
		left: -10px;
	}
	#hd #hd_compare .hd_table li > div img:first-child{
		width: 80%;
		margin:0 -5px;
	}
	#hd #hd_compare .hd_table li{
		padding: 40px 0 30px;
		position: relative;
	}
	#hd #hd_compare .hd_table li:first-child{
		padding-bottom: 0;
	}
	#hd #hd_compare .hd_table li > div:nth-child(2){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	#hd #hd_compare .hd_table li > div{
		width: 50%;
		font-size: 16px;
		padding:0 5px 5px 5px;
		vertical-align: middle;
	}

}
