@charset "utf-8";
/* CSS Document */

body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:100%;
	line-height:1.6;
	color:#333;
	background:#fff;
}

/*Main Visual*/

#containerMV{
  width: 100%;
  height: 0;
  padding-top: calc(380 / 1620 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
  background:url("../../../images/ATOMIC/2023/mainVisual_new_atomic_fac_2023.jpg") center center / cover no-repeat;
  position:relative;
  border-top:3px solid #3399cc;
  border-bottom:3px solid #3399cc;
  
}


#title_MV{
	width:1200px;
	background:rgba( 51,153,204,0.70);
	line-height:70px;
	color:#fff;
	font-size:42px;
	position:absolute;
	top: 30px;
	left: 0px;
	padding:0px 2px;
	text-align:center;
}





/*コンテンツ*/
.container_brand{
	width:960px;
	margin:30px 0 80px;
}


.box_contents{
	width:1340px;
	margin:0 auto;

}
.subTitle{
	width:970px;
	font-size:18px;
	border-bottom:3px solid #3399cc;
	line-height:30px;
	margin:70px 0 30px;
}

.contents_main{
	width:970px;
	margin:30px 70px 50px 0px;
	float:left;
}

/*ブランド基本情報、年度*/
.explain_brand{
	width:970px;
	margin:20px 0 20px;
}

.title_year{
	font-size:26px;
	line-height:42px;
	width:960px;
	margin:30px 0 20px;
	border-bottom:3px dashed rgba(129,129,129,1.00);
	border-left:8px solid rgba(129,129,129,1.00);
	padding-left:10px;
}


/*box_oneModel*/
.box_oneModel{
    width:960px;
	padding:30px 0px 0px;
}

.image_ski{
	float:left;
	margin-left:30px;
}

.container_left{
	width:460px;
	float:left;
	margin-right:50px;
}
.base_info{
	width:440px;
	float:left;
	margin:15px 0 15px;
}
.type{
	width:100px;
	float:left;
	color:#fff;
	font-size:12px;
	line-height:20px;
	text-align:center;
	background:rgba(21,122,253,1.00);
}
.type .tour{
	background:rgba(5,187,20,1.00)
}
.shape{
	width:120px;
	float:left;
	color:#fff;
	font-size:12px;
	line-height:20px;
	text-align:center;
	margin-left:8px;
    background:rgba(249,177,41,1.00);
}
.shape .tt_rocker{
	background:rgba(239,78,0, 1.00);
}
.shape .t_rocker{
	background:rgba(232,0,62, 1.00)
}
.shape .full_rocker{
	background:rgba(71,59,133,1.00);
}
.shape .tt_zero{
	background:rgba(1,106,163,1.00);
}
.shape .t_zero{
	background:rgba(1,147,82,1.00);
}


.table_spec{
	font-size:12px;
	float:left;
	margin:10px 50px 0 0;
	width:400px;
}
.price{
	width:350px;
	font-size:14px;
	float:left;
}
.spec01{
	width:100%;
    border-collapse: separate;
    border-spacing: 0px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}
.spec01 th{
    padding: 2px;
    text-align: center;
    vertical-align: top;
    color: #444;
    background-color: #ccc;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.spec01 td{
	padding: 2px;
    background-color: #fafafa;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
	text-align: center;
}


.explain_ski{
	width:460px;
	float:left;
	margin-right:10px;
	padding:10px 0px;
}

/*side_link*/
.side_link{
	width:300px;
	float:left;
	margin:100px 0 320px 0px;
}

.box_topics{
	width:300px;
	background:#fff;
	position:relative;
	margin:10px 0px 50px;
	float:left;
}

.box_topics{
	color:#333;
}
.box_topics a{
	text-decoration:none;
	color:#333cc;
}

.box_title{
	width:250px;
	position:absolute;
	top: 90px;
	left: 0px;
	background:rgba(248,255,14,0.84);
	font-size:16px;
	line-height:30px;
	padding-left:10px;
}

.explain_box{
	font-size:12px;
	padding:5px 5px;
}

.box_topics{
	-webkit-transition: 0.3s ease-in-out;  
	transition: 0.3s ease-in-out
}
.box_topics:hover{
	opacity: 0.4;  
	filter: alpha(opacity=60); 
}





@media screen and (max-width:480px){

#breadcrumbs{
	display:none;
}	



#title_MV{
	position:absolute;
	top: 18%;
	left: 0px;
	font-size:95%;
	width:95%;
	line-height:160%;
}	

.box_contents{
	width:100%;
	overflow:hidden;
}
.subTitle{
	width:100%;
	font-size:80%;
	margin:5% 0% 3%;
	line-height:120%;
}

.contents_main{
	width:100%;
	margin:3% 0% 3%
}





/*ブランド共通*/

.container_brand{
	width:100%;
	margin:5% 0% 5%;
}

.explain_brand{
	width:98%;
	font-size:80%;
	line-height:150%;
	margin:2% 1% 2% 1%;
	padding:0% 0%;
}
.title_year{
	width:98%;
	font-size:100%;
	line-height:180%;
	
}

/*ブランド共通終わり*/


.box_oneModel{
	width:100%;
	padding:3% 3% 3%;
}
.model_name{
	width:100%;
	font-size:100%;
}
.container_left{
	width:100%;
}
.image_ski{
	width:100%;
	margin-left:0%;
}
.image_ski img{
	width:90%;
	height:auto;
	margin-left:3%;
}
.base_info{
	width:95%;
	font-size:80%;
	margin:1% 0%;
}.price{
	width:100%;
	font-size:80%;
	margin:1% 0%
}
.table_spec{
	width:95%;
	font-size:60%;
	margin:0% 1% 3% 0%;
}
.explain_ski{
	width:95%;
	font-size:80%;
	line-height:150%;
}

/*side_link*/
.side_link{
	width:100%;
	margin:0% 0% 100%;
}
.box_topics{
	width:95%;
	margin:7% 1%;
}
.box_topics img{
	width:100%;
	height:auto;
}
.box_title{
	width:90%;
	font-size:90%;
	position:absolute;
	top: 20%;
	left: 0%;
	
}
.box_topics .explain_box{
	font-size:80%;
	line-height:180%;
}

/*AD*/
.AD_970{
  width:320px;
  	height:100px;
	text-align:center;
	padding:10% 0% 15%;
}
.ad_300_250{
	width:100%;
	text-align:center;
	height:250px;
}
.ad_side_resp{
	width:100%;
	text-align:center;
	margin-top:10%;
}

}

#title_MV{
	width:1400px;
	background:rgba( 51,153,204,0.70);
	line-height:70px;
	color:#fff;
	font-size:42px;
	position:absolute;
	top: 30px;
	left: 0px;
	padding:0px 2px;
	text-align:center;
}




/*コンテンツ*/
.container_brand{
	width:960px;
	margin:30px 0 80px;
}


.box_contents{
	width:1340px;
	margin:0 auto;

}
.subTitle{
	width:970px;
	font-size:18px;
	border-bottom:3px solid #3399cc;
	line-height:30px;
	margin:70px 0 30px;
}

.contents_main{
	width:970px;
	margin:30px 70px 50px 0px;
	float:left;
}

/*ブランド基本情報、年度*/
.explain_brand{
	width:970px;
	margin:20px 0 20px;
}

.title_year{
	font-size:26px;
	line-height:42px;
	width:960px;
	margin:30px 0 20px;
	border-bottom:3px dashed rgba(129,129,129,1.00);
	border-left:8px solid rgba(129,129,129,1.00);
	padding-left:10px;
}


/*box_oneModel*/
.box_oneModel{
    width:960px;
	padding:30px 0px 0px;
}

.image_ski{
	float:left;
	margin-left:30px;
}

.container_left{
	width:460px;
	float:left;
	margin-right:50px;
}
.base_info{
	width:440px;
	float:left;
	margin:15px 0 15px;
}
.type{
	width:100px;
	float:left;
	color:#fff;
	font-size:12px;
	line-height:20px;
	text-align:center;
	background:rgba(21,122,253,1.00);
}
.type .tour{
	background:rgba(5,187,20,1.00)
}
.shape{
	width:120px;
	float:left;
	color:#fff;
	font-size:12px;
	line-height:20px;
	text-align:center;
	margin-left:8px;
    background:rgba(249,177,41,1.00);
}
.shape .tt_rocker{
	background:rgba(239,78,0, 1.00);
}
.shape .t_rocker{
	background:rgba(232,0,62, 1.00)
}
.shape .full_rocker{
	background:rgba(71,59,133,1.00);
}
.shape .tt_zero{
	background:rgba(1,106,163,1.00);
}
.shape .t_zero{
	background:rgba(1,147,82,1.00);
}


.table_spec{
	font-size:12px;
	float:left;
	margin:10px 50px 0 0;
	width:400px;
}
.price{
	width:350px;
	font-size:14px;
	float:left;
}
.spec01{
	width:100%;
    border-collapse: separate;
    border-spacing: 0px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}
.spec01 th{
    padding: 2px;
    text-align: center;
    vertical-align: top;
    color: #444;
    background-color: #ccc;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.spec01 td{
	padding: 2px;
    background-color: #fafafa;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
	text-align: center;
}


.explain_ski{
	width:460px;
	float:left;
	margin-right:10px;
	padding:10px 0px;
}

/*side_link*/
.side_link{
	width:300px;
	float:left;
	margin:100px 0 320px 0px;
}

.box_topics{
	width:300px;
	background:#fff;
	position:relative;
	margin:10px 0px 50px;
	float:left;
}

.box_topics{
	color:#333;
}
.box_topics a{
	text-decoration:none;
	color:#333cc;
}

.box_title{
	width:250px;
	position:absolute;
	top: 90px;
	left: 0px;
	background:rgba(248,255,14,0.84);
	font-size:16px;
	line-height:30px;
	padding-left:10px;
}

.explain_box{
	font-size:12px;
	padding:5px 5px;
}

.box_topics{
	-webkit-transition: 0.3s ease-in-out;  
	transition: 0.3s ease-in-out
}
.box_topics:hover{
	opacity: 0.4;  
	filter: alpha(opacity=60); 
}





@media screen and (max-width:480px){

#breadcrumbs{
	display:none;
}	



#title_MV{
	position:absolute;
	top: 18%;
	left: 0px;
	font-size:90%;
	width:100%;
	line-height:150%;
}	

.box_contents{
	width:100%;
	overflow:hidden;
}
.subTitle{
	width:100%;
	font-size:80%;
	margin:5% 0% 3%;
	line-height:120%;
}

.contents_main{
	width:100%;
	margin:3% 0% 3%;
	overflow:hidden;
}





/*ブランド共通*/

.container_brand{
	width:100%;
	margin:5% 0% 5%;
}

.explain_brand{
	width:98%;
	font-size:80%;
	line-height:150%;
	margin:2% 1% 2% 1%;
	padding:0% 0%;
}
.title_year{
	width:98%;
	font-size:100%;
	line-height:180%;
	
}
.model_year{
	padding-top:3%;
	
}

/*ブランド共通終わり*/


.box_oneModel{
	width:100%;
	padding:3% 3% 3%;
}
.model_name{
	width:100%;
	font-size:100%;
}
.container_left{
	width:100%;
}
.image_ski{
	width:100%;
	margin-left:0%;
}
.image_ski img{
	width:90%;
	height:auto;
	margin-left:3%;
}
.base_info{
	width:95%;
	font-size:80%;
	margin:1% 0%;
}.price{
	width:100%;
	font-size:80%;
	margin:1% 0%
}
.table_spec{
	width:95%;
	font-size:60%;
	margin:0% 1% 3% 0%;
}
.explain_ski{
	width:95%;
	font-size:80%;
	line-height:150%;
}

/*side_link*/
.side_link{
	width:100%;
	margin:0% 0% 100%;
}
.box_topics{
	width:95%;
	margin:7% 1%;
}
.box_topics img{
	width:100%;
	height:auto;
}
.box_title{
	width:90%;
	font-size:90%;
	position:absolute;
	top: 20%;
	left: 0%;
	
}
.box_topics .explain_box{
	font-size:80%;
	line-height:180%;
}

/*AD*/
.AD_970{
	width:320px;
	height:100px;
	text-align:center;
	margin-bottom:15%;
	padding-top:10%;
}
.ad_300_250{
	width:100%;
	text-align:center;
	height:250px;
}
.ad_side_resp{
	width:100%;
	text-align:center;
	margin-top:10%;
}

}