@charset "shift_jis";
@import url(http://fonts.googleapis.com/css?family=Oswald:700);
@media only screen and (min-width: 750px) {
/* ==========================================

	Common

========================================== */
#main { line-height: 1.3}
#contents {
    margin: 0 auto;
    padding-bottom: 60px;
    width: 966px;
	font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", verdana, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
h3 {
	background: none;
	padding: 0;
	margin: 0;
	border: none;}
h2,
#couponBox ul.filter li a.current {
    -moz-background-size: 10px 10px;
    -webkit-background-size: 10px 10px;
    background-color: #dd0017;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #e5002f), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #e5002f), color-stop(.75, #e5002f), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-size: 10px 10px; }
/*
.snsButtons {
	background: #f7efd5;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	margin: 0 auto 10px;
	padding: 12px;
	text-align: center !important;
	width: 380px;
	}
*/
#TITLE h1 {
    width: auto;
    overflow: visible;
    position: static;
    padding-top: 3px;
    font-size: 110%;
    /* white-space: nowrap; */
    min-height: 22px;
    height: auto !important;
    /* height: 22px; */
    line-height: 1;
    margin-left: 18px;
}
#TITLE {
    background: url(http://rurubu.travel/images/icn/icn_page_title_def.gif) no-repeat left top;
}
.head_task {
    margin-left: 18px;
    font-size: 1.2rem;
    line-height: 1.6em;
	margin-bottom: 10px;
}
.movePagetop {
	text-align: right;
	margin-top: 15px !important;
	font-size: 12px;
}
.movePagetop a {
	background: url(/images/icn/icn_arrow_top.gif) no-repeat 0 0.25em;
	padding-left: 12px;
}
.pcBox { display: block;}
#yoko h2 img, #howtoBox.detail h2 img { display: inline-block;}
.spBox { display: none;}
/*-- BREADCHUMBS --*/
#breadChumbs {
    margin: 0 auto;
    padding: 10px 0;
    width: 100%;
}
#breadChumbs p {
    color: #666;
    font-size: 65%;
    line-height: 1.4;
    margin: 0 auto;
    width: 960px;
    transition: 0.2s;
}
#breadChumbs p a.currentPoint {
    text-decoration: none;
}
/* -----overflow-----  */
.bannerBox ul,
.bannerBox01 ul,
#couponBox ul.filter,
#couponBox ul.isotope li .top dl,
#couponBox ul.isotope li .bottom dl.period,
#couponBox ul.isotope li .bottom dl.deadline,
#detail ul,
#detail ul li .bottom,
#yoko dl dl {overflow: hidden;}

#couponBox ul.isotope:after {
    content:" ";
    display:block;
    clear:both;
}
/* -----opacity-----  */
#bannerBox a:hover img,
#bannerBox01 a:hover img,
#couponBox ul.isotope li a:hover img {
    -ms-filter: "alpha(opacity=80)";
    filter: alpha(opacity=80);
    opacity: 0.8; }
/* -----mainVisual-----  */
#mainVisual {
	margin-bottom: 6px;
	position: relative;}
#mainVisual p {
	position: absolute;
	left: 10px;
	top: 13px;
	font-size: 22px;
	font-weight: bold;
	color: #fff;
	line-height: 1;}
#mainVisual p span {
	font-size: 43px;}

/* -----newsBox-----  */
#newsBox {
	margin-bottom: 20px;
	overflow: hidden;}
#newsBox dl {
	overflow: hidden;
	width: 728px;
	float: left;}
#newsBox dl dt {
	float: left;
	width: 128px;
	height: 40px;}
#newsBox dl dd {
	padding: 10px 0 0 148px;
	border: 2px solid #ed0000;
	border-left: none;
	height: 40px;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 12px;
	line-height: 140%;
	}
.slick-next { overflow: hidden; top:50%; right: 10px; text-indent: 100%; white-space: nowrap; z-index: 99; }
.slick-next, .slick-next:focus { background: url(../images/btn_arrow_next_off.png) 0 0 no-repeat; background-size: 20px 20px; }
.slick-next:hover { background: url(../images/btn_arrow_next_on.png) 0 0 no-repeat; background-size: 20px 20px; }
.slick-prev { display: none !important; }
#newsBox .btnArea {
	width: 218px;
	float: right;
	padding-top: 1px;}

/* -----bannerBox-----  */
.bannerBox,
.bannerBox01 {
	background-color: #ededed;
	margin-bottom: 20px;}
.bannerBox h2,
.bannerBox01 h2 {
	margin-bottom: 7px;
	text-align: center;
	padding: 10px 0;}
.bannerBox p,
.bannerBox01 p{
	text-align: center;
	padding: 7px 0 15px;}
.bannerBox ul,
.bannerBox01 ul {
	width: 953px;
	margin: 0 auto;
	padding-bottom:7px;}
.bannerBox ul li,
.bannerBox01 ul li {
	float: left;
	padding: 8px;}

/* -----couponBox filter-----  */
#couponBox {
	margin-bottom: 20px;}
#couponBox ul.filter {
	border-bottom: 4px solid #dd0017;
	padding-left: 2px;}
#couponBox ul.filter li {
	float: left;
	margin-right: 3px;}
#couponBox ul.filter li:last-child,
#couponBox ul.filter li.last {
	margin-right: 0;}
#couponBox ul.filter li a {
	width: 238px;
	-webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
	border-radius: 10px 10px 0 0;
	background-color: #ffe81e;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #ffeb2c), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #ffeb2c), color-stop(.75, #ffeb2c), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #ffeb2c 25%, transparent 25%, transparent 50%, #ffeb2c 50%, #ffeb2c 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #ffeb2c 25%, transparent 25%, transparent 50%, #ffeb2c 50%, #ffeb2c 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #ffeb2c 25%, transparent 25%, transparent 50%, #ffeb2c 50%, #ffeb2c 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #ffeb2c 25%, transparent 25%, transparent 50%, #ffeb2c 50%, #ffeb2c 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #ffeb2c 25%, transparent 25%, transparent 50%, #ffeb2c 50%, #ffeb2c 75%, transparent 75%, transparent);
	background-size: 10px 10px;
	display: block;
	text-decoration: none;
	font-weight: bold;
	color: #dd0017;
	text-align: center;
	font-size: 18px;
	padding: 15px 0 10px;
	}
#couponBox ul.filter li a span {
	width: 100%;
	line-height: 22px;
	background: url(../images/ic_tab.png) no-repeat 95% 0;
	display: block;
	}
#couponBox ul.filter li a.current span {
	background: url(../images/ic_tab_current.png) no-repeat 95% 0;
	}
#couponBox ul.filter li a.current {
	color: #fff;}
#couponBox ul.filter li a:hover {
    -ms-filter: "alpha(opacity=50)";
    filter: alpha(opacity=50);
    opacity: 0.5; }
#couponBox ul.filter li a.current:hover {
    -ms-filter: "alpha(opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1; }
/* -----couponBox isotope-----  */
.couponWrapper {
	background-color: #ededed;
	padding: 20px 0 0px;
    overflow: hidden;}
#couponBox ul.isotope {
	width: 950px;
	margin: 0 auto 20px;
	overflow: visible !important;}
#couponBox p.ttl {
	margin: 0 15px 20px 15px;
	padding: 12px 0 7px 10px;
	color: #fff;
	border-bottom: 4px solid #dd0017;}
#couponBox p.kyusyu {
	background: url(../images/bg_coupon_ttl.png) no-repeat -305px 0;
	padding: 8px 0 2px 10px;}
#couponBox p.all {
	background: url(../images/bg_coupon_ttl.png) no-repeat -285px 0;
	padding: 8px 0 2px 10px;}
#couponBox p.area {
	background: url(../images/bg_coupon_ttl.png) no-repeat -330px 0;}
#couponBox p.recommend {
	background: url(../images/bg_coupon_ttl.png) no-repeat -140px 0;}
#couponBox p.ttl span {
	display: block;
	font-size:18px;
	font-weight: bold;
	padding-left: 30px}
#couponBox p.all span {
	background: url(../images/ic_all.png) no-repeat 0 0;
	line-height: 1.8;
	display: block;
	padding: 2px 0 0 30px;}
#couponBox p.kyusyu span {
	background: url(../images/ic_kyusyu.png) no-repeat 0 50%;
	line-height: 1.8;
	display: block;
	padding: 2px 0 0 30px;}
#couponBox p.area span {
	background: url(../images/ic_area.png) no-repeat 0 0;
	line-height: 1.4}
#couponBox p.recommend span {
	background: url(../images/ic_recommend.png) no-repeat 0 0;
	line-height: 1.4}
#couponBox ul.isotope li {
	float: left;
	padding: 6px;
	min-height: 290px;
	width: 316px;
	position: relative;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	/*
	-webkit-transition-property:-webkit-transform, opacity;
	-moz-transition-property:-moz-transform, opacity;
	-ms-transition-property:-moz-transform, opacity;
	-o-transition-property:-moz-transform, opacity;
	transition-property:transform, opacity;
    -webkit-transition-duration:0.8s;
    -moz-transition-duration:0.8s;
    -ms-transition-duration:0.8s;
    -o-transition-duration:0.8s;
    transition-duration:0.8s;
	*/
}
#couponBox ul.isotope li p.ic {
	position: absolute;
	top: -5px;
	left: -5px;}
#couponBox ul.isotope li p.ic img { height: 53px; width: 53px; }
#couponBox ul.isotope li.finish .overlay,
#couponBox ul.isotope li.finish02 .overlay,
#couponBox ul.isotope li.soon .overlay,
#detail .couponWrapper ul li.finish .overlay {
	position: absolute;
	top: 0;
    left: 0;
    z-index: 100;
	height: 100%;
	width: 100%;}
#couponBox ul.isotope li.finish .overlay img,
#couponBox ul.isotope li.finish02 .overlay img,
#couponBox ul.isotope li.soon .overlay img,
#detail .couponWrapper ul li.finish .overlay img {
	position: absolute;
	top: 30%;
	left: 15%;}
#couponBox ul.isotope li .itemWrapper {
	background-color: #fff;
	width: 300px;
	padding: 2px;}
#couponBox ul.isotope li .inner{
	border: 2px solid #0e75eb;
	background: #fff url(../images/bg_coupon01.png) no-repeat 97% 3%;
	}
#couponBox ul.isotope li {
	cursor: pointer;}
#couponBox ul.isotope li.finish,
#couponBox ul.isotope li.finish02,
#couponBox ul.isotope li.soon,
#detail .couponWrapper ul li.finish { cursor: default }
#detail .couponWrapper ul li.finish { position: relative; }
#couponBox ul.isotope li:hover .inner {
	background: #e5faff url(../images/bg_coupon01.png) no-repeat 97% 3%;}
#couponBox ul.isotope li.finish:hover .inner,
#couponBox ul.isotope li.finish02:hover .inner,
#couponBox ul.isotope li.soon:hover .inner{
	background: #fff url(../images/bg_coupon01.png) no-repeat 97% 3%;}
#couponBox ul.isotope li .inner .top{
	padding: 5px 10px 8px;
	}
#couponBox ul.isotope li.finish .overlay,
#detail .couponWrapper ul li.finish .overlay {
	background: url(../images/ic_soldout.png) no-repeat 50% 50%;
	background-size: 216px 100px;
	}
#couponBox ul.isotope li.finish02 .overlay {
	background: url(../images/ic_finish.png) no-repeat 50% 50%;
	background-size: 216px 100px;
	}
#couponBox ul.isotope li.soon .overlay {
	background: url(../images/ic_comingsoon.png) no-repeat 50% 50%;
	background-size: 216px 100px;
	}
#couponBox ul.isotope li .inner .top p.price{
	text-align:center;
	padding-bottom: 10px;
	margin-bottom: 7px;
	border-bottom: 1px dotted #ccc;
	}
#couponBox ul.isotope li .inner .top p,
#couponBox ul.isotope li .inner .top p a{
	font-weight: bold;
	font-size: 24px;
	color: #dd0017;
	text-decoration: none;
	line-height: 1;
	}
#couponBox ul.isotope li .inner .top p span,
#couponBox ul.isotope li .inner .top p a span{
	display: table-cell;
	vertical-align: middle;
	color: #0e75eb;
	padding: 0 30px;
	height: 75px;
	line-height: 30px;
	text-align: center;
	width: 272px;
	margin-bottom: 5px;
	}
#couponBox ul.isotope li .inner .top p strong,
#couponBox ul.isotope li .inner .top p a strong{
	font-size: 66px;
	font-family: 'Oswald', sans-serif;
	}
#couponBox ul.isotope li .inner .max p a {
	font-size: 20px;
	}
#couponBox ul.isotope li .inner .max p a strong{
	font-size: 56px;
	}
#couponBox ul.isotope li .inner .top dl dl{
	height: 40px;
	}
#couponBox ul.isotope li .inner .top dl dt{
	float: left;
	width: 160px;
	}
#couponBox ul.isotope li .inner .top dl dt img{
	margin-right: 5px;
	}
#couponBox ul.isotope li .inner .top dl dd{
	padding: 10px 0 0 160px;
	text-align: right;
	}
#couponBox ul.isotope li .inner .top dl dd span{
	font-family: 'Oswald', sans-serif;
	font-weight: bold;
	font-size: 20px;
	}
#couponBox ul.isotope li .bottom dl.period,
#couponBox ul.isotope li .bottom dl.deadline {
	border-top: 2px solid #0e75eb;
	}
#couponBox ul.isotope li .bottom dl.period dt,
#couponBox ul.isotope li .bottom dl.deadline dt {
	width: 100px;
	float: left;
	color: #fff;
	font-weight: bold;
	padding: 8px 0 0;
	text-align: center;
	height: 24px;
	-moz-background-size: 10px 10px;
    -webkit-background-size: 10px 10px;
	background-size: 10px 10px;
	font-size: 12px;
	}
#couponBox ul.isotope li .bottom dl.period dd,
#couponBox ul.isotope li .bottom dl.deadline dd {
	padding-left: 100px;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	background-color: #ffffe5;
	padding: 8px 0 0;
	height: 24px;
	}
#couponBox ul.isotope li .bottom dl.period dt {
    background-color: #117bec;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #0e75eb), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #0e75eb), color-stop(.75, #0e75eb), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #0e75eb 25%, transparent 25%, transparent 50%, #0e75eb 50%, #0e75eb 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #0e75eb 25%, transparent 25%, transparent 50%, #0e75eb 50%, #0e75eb 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #0e75eb 25%, transparent 25%, transparent 50%, #0e75eb 50%, #0e75eb 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #0e75eb 25%, transparent 25%, transparent 50%, #0e75eb 50%, #0e75eb 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #0e75eb 25%, transparent 25%, transparent 50%, #0e75eb 50%, #0e75eb 75%, transparent 75%, transparent); }
#couponBox ul.isotope li .bottom dl.deadline dt {
    background-color: #0546e2;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #043fe0), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #043fe0), color-stop(.75, #043fe0), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #043fe0 25%, transparent 25%, transparent 50%, #043fe0 50%, #043fe0 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #043fe0 25%, transparent 25%, transparent 50%, #043fe0 50%, #043fe0 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #043fe0 25%, transparent 25%, transparent 50%, #043fe0 50%, #043fe0 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #043fe0 25%, transparent 25%, transparent 50%, #043fe0 50%, #043fe0 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #043fe0 25%, transparent 25%, transparent 50%, #043fe0 50%, #043fe0 75%, transparent 75%, transparent); }
/* -----couponBox isotope other-----  */
#couponBox ul li.orange .inner{
	border: 2px solid #ff7f00;
	background: #fff url(../images/bg_coupon02.png) no-repeat 97% 3%;
	}
#couponBox ul li.orange:hover .inner {
	background: #ffd2a6 url(../images/bg_coupon02.png) no-repeat 97% 3%;}
#couponBox ul li.orange.finish:hover .inner,
#couponBox ul li.orange.finish02:hover .inner,
#couponBox ul li.orange.soon:hover .inner {
	background: #fff url(../images/bg_coupon02.png) no-repeat 97% 3%;}
#couponBox ul li.orange .inner .top p span,
#couponBox ul li.orange .inner .top p a span{
	color: #ff7f00;
	}
#couponBox ul li.orange .bottom dl.period,
#couponBox ul li.orange .bottom dl.deadline {
	border-top: 2px solid #ff7f00;
	}
#couponBox ul li.orange .bottom dl.period dt {
    background-color: #ff7f00;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #ff8400), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #ff8400), color-stop(.75, #ff8400), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent); }
#couponBox ul li.orange .bottom dl.deadline dt {
    background-color: #ff5500;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #ff5b00), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #ff5b00), color-stop(.75, #ff5b00), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent); }
/* -----howtoBox-----  */
#howtoBox {
	margin-bottom: 20px;
	text-align: center;}
#howtoBox h2 {
	margin-bottom: 40px;
	padding: 10px;}
#howtoBox .box {
	padding: 40px 0 10px;
	position: relative;
	border: 3px solid #fff200;
	border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
	width: 854px;
	margin: 0 auto 40px;}
#howtoBox .box h3 {
	position: absolute;
	top: -23px;
	left: 347px;}
#howtoBox .box p {
	margin-bottom: 20px;}
#howtoBox .box p.txt {
	font-weight: bold;
	font-size: 22px;}
#howtoBox .box p.caution {
	color: #FF0004}

/* -----detail-----  */
#detail {
	margin-bottom: 20px}
#detail h2 {
	color: #fff;
	font-size: 20px;
	padding: 20px 10px 20px 20px;
	font-weight: normal; }
#detail h2 span {
	background: url(../images/ic_detail_h2.png) no-repeat 0 50%;
	padding-left:40px;
	display: inline-block;}
#detail ul {
	width: 936px;
	margin: 0 auto 20px;}
#detail ul li {
	float: left;
	padding: 15px;}
#detail ul li .detailWrapper {
	background-color: #fff;
	width: 438px;
	padding: 5px;}
#detail ul li .inner{
	border: 2px solid #ccc;
	}
#detail ul li .inner .top{
	padding: 20px 10px 20px;
	text-align: center;
	}
#detail ul li .inner .top p.catch{
	color: #7c3400;
	/*background-color: #fff533;*/
	font-size: 20px;
	font-weight: bold;
	border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
	/*padding: 10px 0;*/
	display: table-cell;
	vertical-align: middle;
	width: 408px;
	padding-bottom: 10px;
	}
#detail ul li .inner .top p.catch span{
	font-family: 'Oswald', sans-serif;
	}
#detail ul li .inner .top p.price{
	font-weight: bold;
	font-size: 24px;
	color: #dd0017;
	text-decoration: none;
	line-height: 1;
	}
#detail ul li .inner .top p.price strong{
	font-size: 66px;
	font-family: 'Oswald', sans-serif;
	}
#detail ul li .bottom dl.key,
#detail ul li .bottom dl.password {
	width: 212px;
	float: left;
	}
#detail ul li .bottom dl.key,
#detail ul li .bottom dl.password {
	width: 212px;
	float: left;
	}
#detail ul li .bottom dl.key{
	border-right: 2px solid #ccc;
	}
#detail ul li .bottom dl.key dt,
#detail ul li .bottom dl.password dt {
	border-top: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	padding: 13px 0;
	text-align: center;
	-moz-background-size: 10px 10px;
    -webkit-background-size: 10px 10px;
	background-size: 10px 10px;
	}
#detail ul li .bottom dl.key dd,
#detail ul li .bottom dl.password dd {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	background-color: #ffffe5;
	padding: 13px 0;
	}
#detail ul li .bottom dl.key dd {
	color: #dd0017;
	}
#detail ul li .bottom dl.password dd {
	color: #dd0017;
	}
#detail ul li .bottom dl.key dt {
    background-color: #dd0017;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #e5002f), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #e5002f), color-stop(.75, #e5002f), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
	}
#detail ul li .bottom dl.password dt {
    background-color: #dd0017;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #e5002f), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #e5002f), color-stop(.75, #e5002f), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent); }
#detail p.txt {
	width: 906px;
	margin: 0 auto 30px;
	line-height: 1.5;
	font-size: 12px;}
/* -----detailBtnArea-----  */
.detailBtnArea {
	text-align: center;
	margin-bottom: 40px;
	}
.detailBtnArea p {
	margin-bottom: 10px;
	}
/* ----------  */
#detail .recoArea {
	padding: 30px;}
#detail .recoArea dl {
	overflow: hidden;
	background-color: #fff;
	padding: 20px;}
#detail .recoArea dl dt {
	float: left;
	width: 395px;
	box-sizing: border-box;}
#detail .recoArea dl dt img {
	width: 395px;}
#detail .recoArea dl dd {
	padding: 0 20px 10px 415px;
	box-sizing: border-box;
	position: relative;
	height: 297px; }
#detail .recoArea dl dd p{
	margin-bottom: 20px;
	font-size: 12px;
	line-height: 1.2;}
#detail .recoArea dl dd p.ttl {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 10px;
	line-height: 1;}
#detail .recoArea dl dd dl {
	padding: 0;
	width: 447px;
	margin-bottom: 10px;}
#detail .recoArea dl dd dl dt {
	width: 250px;
	height: 34px;
	font-size: 12px;
	line-height: 1.2;}
#detail .recoArea dl dd dl.star dt {
	font-size: 34px;
	font-weight: bold;
	color: #dd0017;
	line-height: 40px;
	padding-left: 189px;}
#detail .recoArea dl dd dl.map dt span {
	display: block;
	font-weight:bold;}
#detail .recoArea dl dd dt.star2 { background: url(../images/ic_star2.png) no-repeat 0 50%;}
#detail .recoArea dl dd dt.star3 { background: url(../images/ic_star3.png) no-repeat 0 50%;}
#detail .recoArea dl dd dt.star4 { background: url(../images/ic_star4.png) no-repeat 0 50%;}
#detail .recoArea dl dd dt.star5 { background: url(../images/ic_star5.png) no-repeat 0 50%;}
#detail .recoArea dl dd dd {
	padding: 0;
	float: right;
	width: 151px;
	position: static;
	height: auto;}
#detail .recoArea dl dd p.btn {
	position: absolute;
	margin-bottom: 0;
	bottom: 0;
	right: 0;}
/* -----howtodetail-----  */
#howtoBox.detail dl dt {
    -moz-background-size: 10px 10px;
    -webkit-background-size: 10px 10px;
    background-color: #dd0017;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #e5002f), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #e5002f), color-stop(.75, #e5002f), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-size: 10px 10px;
	padding: 0; }
#howtoBox.detail dl dd,
#yoko dl dd {
	display: none;
	}
#howtoBox.detail dl dd {
	padding-top: 20px;
}
/* -----yoko-----  */
#yoko {
	margin-bottom: 40px;
	font-size: 12px;
	line-height: 1.6;}
#yoko dl dt.ttl {
	-moz-background-size: 10px 10px;
    -webkit-background-size: 10px 10px;
    background-color: #dd0017;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #e5002f), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #e5002f), color-stop(.75, #e5002f), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #e5002f 25%, transparent 25%, transparent 50%, #e5002f 50%, #e5002f 75%, transparent 75%, transparent);
    background-size: 10px 10px;
	margin-bottom: 20px;
	text-align: center; }
#yoko h2,
#howtoBox.detail h2 {
	padding: 15px 0;
	background: url("../images/ic_open.png") no-repeat 96% 50%;
	background-size:36px;
	}
#yoko dl dt.open h2,
#howtoBox.detail dl dt.open h2 {
	background: url("../images/ic_close.png") no-repeat 96% 50%;
	background-size:36px;
	}
#yoko dl dl {
	background: #fffbd9;
	border: 1px solid #ccc;
	border-top: none;
	width: 810px;
	margin: 0 auto;
}

#yoko dl dl dt,dd {
	padding: 3px;
}

#yoko dl dl dt {
	border-top: 1px solid #ccc;
	clear: left;
	float: left;
	width: 180px;
	color: #dd0017;
	padding: 10px;
}

#yoko dl dl dd {
	display: block;
	background: #fff;
	border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	margin-left: 180px;
	padding: 10px;
}
#yoko dl dd ul {
	padding-left: 17px;
}
#yoko dl dd ul li {
	list-style-type: disc;
}
/* -----detail color-----  */
.bannerBox h2.red,
.sky .bannerBox h2,
.orange .bannerBox h2,
.blue .bannerBox h2 {
	padding: 15px 0; }
.sky #detail h2,
.sky #detail ul li .bottom dl.key dt,
.sky #howtoBox.detail dl dt,
.sky #detail ul li .bottom dl.password dt,
.sky #yoko dl dt.ttl,
.sky .bannerBox h2 {
    background-color: #03aff8;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #19b6f9), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #19b6f9), color-stop(.75, #19b6f9), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #19b6f9 25%, transparent 25%, transparent 50%, #19b6f9 50%, #19b6f9 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #19b6f9 25%, transparent 25%, transparent 50%, #19b6f9 50%, #19b6f9 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #19b6f9 25%, transparent 25%, transparent 50%, #19b6f9 50%, #19b6f9 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #19b6f9 25%, transparent 25%, transparent 50%, #19b6f9 50%, #19b6f9 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #19b6f9 25%, transparent 25%, transparent 50%, #19b6f9 50%, #19b6f9 75%, transparent 75%, transparent); }
/*
.sky #detail ul li .bottom dl.password dt,
.sky #yoko dl dt.ttl {
    background-color: #009ecc;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #0099c5), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #0099c5), color-stop(.75, #0099c5), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #0099c5 25%, transparent 25%, transparent 50%, #0099c5 50%, #0099c5 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #0099c5 25%, transparent 25%, transparent 50%, #0099c5 50%, #0099c5 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #0099c5 25%, transparent 25%, transparent 50%, #0099c5 50%, #0099c5 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #0099c5 25%, transparent 25%, transparent 50%, #0099c5 50%, #0099c5 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #0099c5 25%, transparent 25%, transparent 50%, #0099c5 50%, #0099c5 75%, transparent 75%, transparent); }
*/
.sky #detail ul li .bottom dl.key dd,
.sky #detail ul li .bottom dl.password dd {
	color: #03aff8;}
/*
.sky #detail ul li .bottom dl.password dd {
	color: #009ecc;}
*/
.sky #yoko h2,
.sky #howtoBox.detail h2 {
	background: url("../images/ic_open_sky.png") no-repeat 96% 50%;
	background-size:36px;
	}
.sky #yoko dl dt.open h2,
.sky #howtoBox.detail dl dt.open h2 {
	background: url("../images/ic_close_sky.png") no-repeat 96% 50%;
	background-size:36px;
	}

.orange #detail h2,
.orange #detail ul li .bottom dl.key dt,
.orange #howtoBox.detail dl dt,
.orange #detail ul li .bottom dl.password dt,
.orange #yoko dl dt.ttl,
.orange .bannerBox h2 {
    background-color: #ff7f00;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #ff8400), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #ff8400), color-stop(.75, #ff8400), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #ff8400 25%, transparent 25%, transparent 50%, #ff8400 50%, #ff8400 75%, transparent 75%, transparent); }
/*
.orange #detail ul li .bottom dl.password dt,
.orange #yoko dl dt.ttl {
    background-color: #ff5500;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #ff5b00), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #ff5b00), color-stop(.75, #ff5b00), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #ff5b00 25%, transparent 25%, transparent 50%, #ff5b00 50%, #ff5b00 75%, transparent 75%, transparent); }
*/
.orange #detail ul li .bottom dl.key dd,
.orange #detail ul li .bottom dl.password dd {
	color: #ff7f00;}
/*
.orange #detail ul li .bottom dl.password dd {
	color: #ff5500;}
*/
.orange #yoko h2,
.orange #howtoBox.detail h2 {
	background: url("../images/ic_open_orange.png") no-repeat 96% 50%;
	background-size:36px;
	}
.orange #yoko dl dt.open h2,
.orange #howtoBox.detail dl dt.open h2 {
	background: url("../images/ic_close_orange.png") no-repeat 96% 50%;
	background-size:36px;
	}

.blue #detail h2,
.blue #detail ul li .bottom dl.key dt,
.blue #howtoBox.detail dl dt,
.blue #detail ul li .bottom dl.password dt,
.blue #yoko dl dt.ttl,
.blue .bannerBox h2 {
    background-color: #177ced;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #1276e6), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #1276e6), color-stop(.75, #1276e6), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #1276e6 25%, transparent 25%, transparent 50%, #1276e6 50%, #1276e6 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #1276e6 25%, transparent 25%, transparent 50%, #1276e6 50%, #1276e6 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #1276e6 25%, transparent 25%, transparent 50%, #1276e6 50%, #1276e6 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #1276e6 25%, transparent 25%, transparent 50%, #1276e6 50%, #1276e6 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #1276e6 25%, transparent 25%, transparent 50%, #1276e6 50%, #1276e6 75%, transparent 75%, transparent); }
/*
.blue #detail ul li .bottom dl.password dt,
.blue #yoko dl dt.ttl {
	background-color: #044dd3;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #0047ca), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #0047ca), color-stop(.75, #0047ca), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #0047ca 25%, transparent 25%, transparent 50%, #0047ca 50%, #0047ca 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #0047ca 25%, transparent 25%, transparent 50%, #0047ca 50%, #0047ca 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #0047ca 25%, transparent 25%, transparent 50%, #0047ca 50%, #0047ca 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #0047ca 25%, transparent 25%, transparent 50%, #0047ca 50%, #0047ca 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #0047ca 25%, transparent 25%, transparent 50%, #0047ca 50%, #0047ca 75%, transparent 75%, transparent); }
*/
.blue #detail ul li .bottom dl.key dd,
.blue #detail ul li .bottom dl.password dd {
	color: #177ced;}
/*
.blue #detail ul li .bottom dl.password dd {
	color: #044dd3;}
*/
.blue #yoko h2,
.blue #howtoBox.detail h2 {
	background: url("../images/ic_open_blue.png") no-repeat 96% 50%;
	background-size:36px;
	}
.blue #yoko dl dt.open h2,
.blue #howtoBox.detail dl dt.open h2 {
	background: url("../images/ic_close_blue.png") no-repeat 96% 50%;
	background-size:36px;
	}

.green #detail h2,
.green #detail ul li .bottom dl.key dt,
.green #howtoBox.detail dl dt {
    background-color: #76c42a;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #70be23), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #70be23), color-stop(.75, #70be23), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #70be23 25%, transparent 25%, transparent 50%, #70be23 50%, #70be23 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #70be23 25%, transparent 25%, transparent 50%, #70be23 50%, #70be23 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #70be23 25%, transparent 25%, transparent 50%, #70be23 50%, #70be23 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #70be23 25%, transparent 25%, transparent 50%, #70be23 50%, #70be23 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #70be23 25%, transparent 25%, transparent 50%, #70be23 50%, #70be23 75%, transparent 75%, transparent); }
.green #detail ul li .bottom dl.password dt,
.green #yoko dl dt.ttl {
    background-color: #328400;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #2f7e00), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, #2f7e00), color-stop(.75, #2f7e00), color-stop(.75, transparent), to(transparent));
    background-image: -webkit-linear-gradient(-45deg, #2f7e00 25%, transparent 25%, transparent 50%, #2f7e00 50%, #2f7e00 75%, transparent 75%, transparent);
    background-image: -moz-linear-gradient(-45deg, #2f7e00 25%, transparent 25%, transparent 50%, #2f7e00 50%, #2f7e00 75%, transparent 75%, transparent);
    background-image: -ms-linear-gradient(-45deg, #2f7e00 25%, transparent 25%, transparent 50%, #2f7e00 50%, #2f7e00 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, #2f7e00 25%, transparent 25%, transparent 50%, #2f7e00 50%, #2f7e00 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, #2f7e00 25%, transparent 25%, transparent 50%, #2f7e00 50%, #2f7e00 75%, transparent 75%, transparent); }
.green #detail ul li .bottom dl.key dd {
	color: #76c42a;}
.green #detail ul li .bottom dl.password dd {
	color: #328400;}

}