@charset "utf-8";

/* -----------------------------------------------------------
 File name:      otokurosen.css
 Style Info:     各特集独自のスタイル：DPお得路線LP
----------------------------------------------------------- */

.catch {
	padding:10px;
}
.dataInfo {
	background-color:#f9f2d5;
	border:1px solid #f5e8b3;
	padding:6px 10px;
	font-size:10px;
	color:#993300;
	line-height:1.5;
}

#otoku_leftBox{
	width:230px;
	float:left;
	margin:5px 15px 15px 0;
	border:#cc0000 3px solid;
	border-bottom:#cc0000 7px solid;
	overflow: hidden;
	display:inline;
	}

#otoku_middleBox{
	width:230px;
	float:left;
	margin:5px 15px 15px 0;
	border:#001e69 3px solid;
	border-bottom:#001e69 7px solid;
	overflow: hidden;
	display:inline;
	}
	
#otoku_rightBox{
	width:230px;
	float:right;
	margin:5px 0 15px 0;
	border:#2ca003 3px solid;
	border-bottom:#2ca003 7px solid;
	overflow: hidden;
	display:inline;
	}
	
.otoku_btnBox{
	width:210px;
	margin:10px;
	float:left;
	display:block;
}

.JAL_btn a{
	display:block;
	overflow:hidden;
	background:url(../images/jal_button_off.jpg);
	width: 210px;
	height: 45px;
	text-align: center;
	text-decoration: none !important;
	clear: both;
	font-size:16px;
	font-weight:bold;
	color:#3C3C3C;
	line-height: 30px;
	outline: none;
}
.JAL_btn::before,
.JAL_btn::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.JAL_btn,
.JAL_btn::before,
.JAL_btn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.JAL_btn a:hover {
	background:url(../images/jal_button_on.jpg);
	color:#666464;
}

.ANA_btn a{
	display:block;
	overflow:hidden;
	background:url(../images/ana_button_off.jpg);
	width: 210px;
	height: 45px;
	text-align: center;
	text-decoration: none !important;
	clear: both;
	font-size:16px;
	font-weight:bold;
	color:#3C3C3C;
	line-height: 30px;
	outline: none;
}
.ANA_btn::before,
.ANA_btn::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.ANA_btn,
.ANA_btn::before,
.ANA_btn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.ANA_btn a:hover {
	background:url(../images/ana_button_on.jpg);
	color:#666464;
}

.JR_btn a{
	display:block;
	overflow:hidden;
	background:url(../images/jr_button_off.jpg);
	width: 210px;
	height: 45px;
	text-align: center;
	text-decoration: none !important;
	clear: both;
	font-size:16px;
	font-weight:bold;
	color:#3C3C3C;
	line-height: 30px;
	outline: none;
}
.JR_btn::before,
.JR_btn::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.JR_btn,
.JR_btn::before,
.JR_btn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.JR_btn a:hover {
	background:url(../images/jr_button_on.jpg);
	color:#666464;
}

.otoku_btnBox .LeftPrice{
	text-align:center;
	font-size:16px;
	font-weight:bold;
	color:#ff5b00;
	margin:2px auto 4px auto;
}
#Leftbar{
	border-bottom:#ff5b00 2px dotted;
	margin:0 7px;
	height:2px;
	clear:both;
}
.otoku_btnBox .MiddlePrice{
	text-align:center;
	font-size:16px;
	font-weight:bold;
	color:#104392;
	margin:2px auto 4px auto;
}
#Middlebar{
	border-bottom:#104392 2px dotted;
	margin:0 7px;
	height:2px;
	clear:both;
}
.otoku_btnBox .RightPrice{
	text-align:center;
	font-size:14px;
	font-weight:bold;
	color:#38881b;
	margin:2px auto 4px auto;
}
#Rightbar{
	border-bottom:#38881b 2px dotted;
	margin:0 7px;
	height:2px;
	clear:both;
}

.textBox{
	font-size:12px;
	color:#333333;
	margin:5px auto 3px auto;
	text-align:left;
}

.textBox_em{
	font-size:12px;
	color:#ff3600;
	margin:3px auto;
	text-align:center;
	font-weight:bold;
}


/* clearfix */
#otoku_leftBox,#otoku_leftBox:before,
#otoku_leftBox,#otoku_leftBox:after {
content: "";
display: table;
}

#otoku_leftBoxr,#otoku_leftBox:after {
clear: both;
}

#otoku_middleBox,#otoku_middleBox:before,
#otoku_middleBox,#otoku_middleBox:after {
content: "";
display: table;
}

#otoku_middleBoxr,#otoku_middleBox:after {
clear: both;
}

#otoku_rightBox,#otoku_rightBox:before,
#otoku_rightBox,#otoku_rightBox:after {
content: "";
display: table;
}

#otoku_rightBoxr,#otoku_rightBox:after {
clear: both;
}


/* For IE 6/7 (trigger hasLayout) */
#otoku_leftBox,#otoku_middleBox,#otoku_rightBox {
zoom: 1;
}

.cautionarea {
	width:740px;
	clear:both;
}
.cautionarea_text {
	height:100%;
	font-size:12px;
	background-color:#EDECDC;
	padding:5px 30px 10px 90px;
	margin-bottom:10px;
}

.cautionarea_text:after {
content: ".";
display: block;
clear: both;
height: 0;
max-height: 0;
visibility: hidden;
}

.cautionarea dl {	
	border-top: none;
	width: 600px;
}

.cautionarea dt {
	width: 120px;
	margin-bottom:5px;
	clear: left;
	float: left;
}

.cautionarea dd {
	width:480px;
	float: right;
	margin:0 0 5px -20px;
}

.contents-otokurosen {
  margin: 10px auto 20px;
}
.contents-otokurosen > div#main {
  width: 100%;
  margin-top: 20px;
  padding: 20px !important;
  background: #fbf4ea;
  float: none;
}
.contents-otokurosen > div#main::after {
  content: "";
  display: block;
  height: 0;
  visibility: hidden;
  clear: both;
}
.contents-otokurosen #otoku_leftBox {
  display: block;
  width: 290px;
  margin: 0;
  border: 0 none;
}
.contents-otokurosen #otoku_middleBox {
  display: block;
  width: 290px;
  margin: 0 0 0 20px;
  border: 0 none;
}
.contents-otokurosen #otoku_rightBox {
  display: block;
  width: 290px;
  margin: 0;
  border: 0 none;
}
.contents-otokurosen #otoku_leftBox::before, 
.contents-otokurosen #otoku_leftBox::after, 
.contents-otokurosen #otoku_middleBox::before, 
.contents-otokurosen #otoku_middleBox::after, 
.contents-otokurosen #otoku_rightBox::before, 
.contents-otokurosen #otoku_rightBox::after {
  display: none;
}
.contents-otokurosen #otoku_leftBox > img, 
.contents-otokurosen #otoku_middleBox > img, 
.contents-otokurosen #otoku_rightBox > img {
  display: block;
  margin-bottom: 10px;
}
.contents-otokurosen .otoku_btnBox {
  width: 100%;
  min-height: 262px;
  margin: 0;
  padding: 12px;
  background: #fff;
  box-sizing: border-box;
  position: relative;
}
.contents-otokurosen #otoku_leftBox > div:not(:first-of-type)::before, 
.contents-otokurosen #otoku_middleBox > div:not(:first-of-type)::before, 
.contents-otokurosen #otoku_rightBox > div:not(:first-of-type)::before {
  content: "";
  display: block;
  height: 1px;
  margin: 0 12px;
  background: #e0dbd7;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
}
.contents-otokurosen .otokuTitle {
  font-size: 14px;
  font-weight: bold;
  line-height: 1.4;
}
.contents-otokurosen .otokuTitle > a {
  display: inline-block;
  min-height: 20px;
  padding: 0 0 0 28px;
  position: relative;
  color: #1558ce;
  text-decoration: none !important;
}
.contents-otokurosen .otokuTitle > a:hover {
  color: #e77611;
}
.contents-otokurosen .otokuTitle > a::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  margin: auto 0;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
}
.contents-otokurosen #otoku_leftBox .otokuTitle > a::before, 
.contents-otokurosen #otoku_middleBox .otokuTitle > a::before {
  background: transparent url(/assets/img/common/icons/icon_air_ora.svg) no-repeat left top / 20px 20px;
}
.contents-otokurosen #otoku_rightBox .otokuTitle > a::before {
  background: transparent url(/assets/img/common/icons/icon_shinkansen_ora.svg) no-repeat left top / 20px 20px;
}
.contents-otokurosen .otokuPrice {
  margin-top: 8px;
  color: #fc0d1c;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
}
.contents-otokurosen .textBox {
  margin: 4px 0 0;
  color: #5b4843;
  font-size: 12px;
  line-height: 1.5;
}
.contents-otokurosen .textBox_em {
  display: block;
  margin: 0 0 4px;
  color: #3b1800;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5;
  text-align: left;
}