@charset "utf-8";
/* CSS Document */
@import url('../common.css');
/* 共通 */

.section{
	overflow:hidden;
	clear:both;
}
#section2 li{
	background:url(../../../images/product/honny/border.png) repeat-x left bottom;
}
#section2 li:last-child{
	background:none;
	padding-bottom:0;
}
#section3 li.s3_items .image{
	text-align:center;
}

.toptxt {
    font-weight: bold;
    line-height: 2;
}
.mov01{
	text-align: center;
	margin: 5% auto;
}
/*modal
----------------------------------------------------*/
#modal .m_overlay{
	background: url(../../../images/product/honey/cont_bg1.png) !important;
}
#modal .movie_title{
	color: #5E3812 !important;
}
.d-block{
	display:block;
}
.att-mark{
	font-size:0.7em;
	position:relative;
	top:-0.3em;
}
/*PC
----------------------------------------------------*/
@media screen and (min-width:1081px),print{
#topimage{
	position:relative;
	    margin-bottom: 30px;
}
#topimage .btn{
	bottom:-20px;
	right:15px;
	position:absolute;
}
#topimage .btn a{
	display:block;
	width:126px;
	height:126px;
	background:url(../../../images/product/honey/t_btn1.png) no-repeat ;
}
.section h3{
	background:url(../../../images/product/honey/tle_bg_pc.gif) no-repeat center #603813;
	padding-top:13px;
	min-height:35px;
	text-align:center;
	margin-bottom:20px;
}
#section1 ul{
	position:relative;
	background:url(../../../images/product/honey/s1_bg.png) no-repeat center 55px;
	height:695px;
	width:930px;
	margin-left:auto;
	margin-right:auto;
}
#section1 li{
	position:absolute;
}
#section1 .text1{
	top:0;
	left:0;
	width:235px;
}
#section1 .text2{
	right:0;
	top:25px;
	width:235px;
}
#section1 .text3{
	width:270px;
	bottom:180px;
	left:0;
}
/*Section2
--------------------------*/
#section2 ul,#section2 li{
	overflow:hidden;
	clear:both;
}
#section2 li{
	width:930px;
	margin:0 auto 30px;
	padding:0 25px 25px;
	float:left;
}
#section2 .textbox{
	padding-top:12px;
	margin-right:19px;
	float:left;
}
/*Section3
--------------------------*/
#section3 ul{
	overflow:hidden;
	clear:both;
	margin:0 auto;
	width:840px;
}
#section3 li{
	float:left;
}
#section3 li.textbox{
	padding-left:180px;
	background:url(/../../images/product/honey/s2_bg.png) no-repeat left;
	height:142px;
	display:table;
	table-layout:fixed;
	width:360px;
	padding-right:20px;
}
#section3 li.s3_items{
	width:250px;
	margin-left:30px;
	margin-bottom:60px;
}
#section3 li.s3_items .image{
	margin-bottom:10px;
}
#section3 li.textbox .text{
	display:table-cell;
	vertical-align:middle;
}

 .toptxt {
    width: 830px;
    margin: 0 auto 40px;
    font-size: 150%;
}    
}


/*Tab&Phone
--------------------------------------------------*/
@media screen and (max-width:1080px),print{
    #topimage{
	margin-bottom:4%;
	position:relative;
}

.toptxt {
   font-size: 120%;
}     

#section1 ul{
	overflow:hidden;
	clear:both;
}
#section1 li .image{
	text-align:center;
}
.section h3{
	background:#603813;
	text-align:center;
	padding-top:3%;
	padding-bottom:3%;
	line-height: 0;
}
#section3 li.textbox{
	overflow:hidden;
	clear:both;
	float:none;
}
	.toptxt {
	   margin: 0 5% 5%;
	}

	.mr0{
		margin-right:0!important;
	}
	.section h3{
		margin-bottom:5%;
	}
	#section1 li{
		overflow:hidden;
		display:table;
		table-layout:fixed;
		clear:both;
		width:100%;
		margin-bottom:3%;
	}
	#section1 li >div{
		display:table-cell;
		overflow:hidden;
		vertical-align:middle;
	}
	#section2 li{
		margin-bottom:5%;
	}
	#section3 li.textbox{
		margin-bottom:3%;
	}
	#section3 .s3_items{
		width:48.5%;
		margin-left:3%;
		margin-bottom:5%;
		float:left;
	}
	#section3 .s3_items .image{
		margin-bottom:3%;
	}
	#section3 .s3_items:nth-child(2n){
		margin-left:0;
	}
	#topimage .btn a{
		display:block;
		text-align:center;
		color:#ffffff;
		padding:2%;
		background:#603813;
	}
	#topimage .btn a span{
		display:block;
		text-align:center;
		color:#fdcf00;
		font-size:120%;
	}
	.mov01{
		width: 90%;
	}
}