@charset "Shift_JIS";

/* @import url(/common/css/jtb_site_970.css); */

/* ============= h1 ================= */
#contents_area h1{
	font-size:134%;
	font-weight:bold;
	border:solid 1px #dadada;
}
#contents_area h1 span{
	display:block;
	padding:0 10px;
	line-height:35px;
	border-left:solid 6px #c81528;
}

/* ============= campagin ================= */
#contents_area #main_contents{
	margin:15px auto 40px;
	width:950px;
	font-size:12px;
}

/* ============= main_container ================= */
#contents_area #main_container{
	float:left;
	display:inline;
	width:675px;
	font: 15px/1.51 Meiryo,"�揀Cリオ","MS PGothic","ＭＳ Ｐゴシック","MS PGothic",Osaka,"Hiragino Kaku Gothic Pro",sans-serif;
}
#main_container .eravelkome{
	font-size:10px;
}

/* tab */
#main_container #tabs{
	margin-top:30px;
}
#main_container .ui-tabs .ui-tabs-nav li{
	float: left;
	display:inline;
	width:225px;
}
#main_container .ui-tabs .ui-tabs-nav a{
	display:block;
	padding:15px 5px;
	text-align:center;
	font-size:16px;
	color:#333;
	border-right:solid 1px #fff;
	background:#d7d7d7;
}
#main_container .ui-tabs .ui-tabs-nav a span{
	padding-left:20px;
	background:url(/myjtb/stage/eravelclub/images/tab_ico.gif) no-repeat 10px 0.4em;
}
#main_container .ui-tabs .ui-tabs-nav li.ui-state-active{
	padding-bottom:6px;
	background:url(/myjtb/stage/eravelclub/images/tab_ico_ac.gif) no-repeat center bottom;
}
#main_container .ui-tabs .ui-tabs-nav li.ui-state-active a{
	color:#fff;
	font-weight:bold;
	background:#c81528;
}
#main_container .ui-tabs .ui-tabs-nav li.ui-state-active a span{
	padding-left:0;
	background:none;
}
#main_container .ui-tabs .ui-tabs-nav a:hover{
	text-decoration:none;
	background:#e0e0e0;
}
#main_container .ui-tabs .ui-tabs-nav li.ui-state-active a:hover{
	background:#c81528;
}

#main_container .ui-tabs .ui-tabs-panel {
	display: block;
}
#main_container .ui-tabs .ui-tabs-hide { display: none !important; }


#main_container #tabs h2{
	padding:0 0 15px 10px;
	font-size:22px;
	border:none;
	border-bottom:solid 1px #ccc;
	background:none;
}
#main_container #tabs h2:after{
    background: none;
    content: "";
    display:inherit;
    height: auto;
    position: none;
    width: auto;
}
#main_container #tabs h3{
	border:none;
}
#main_container #tabs h3:before{
    background:none;
    border-radius:0;
    content: "";
    display: inherit;
    height: auto;
    position: none;
    width: auto;
}

#main_container .section{
	margin-top:50px;
}

/* about */

#main_container .abouttxtLeft{
	float:left;
	display:inline;
	margin:25px 0 0 10px;
	width:360px;
}
#main_container .abouttxtRight{
	float:right;
	display:inline;
	margin:25px 10px 0 0;
	width:280px;
}

#main_container .useex{
	padding:20px 30px;
	border-radius:8px;
	background:url(/myjtb/stage/eravelclub/images/img_ex.jpg) no-repeat 570px 167px #efefef;
}
#main_container .useex h3{
	font-size:22px;
	font-weight:bold;
}
#main_container .useex ul{
	margin:10px 0 0 0;
}
#main_container .useex li{
	float:left;
	display:block;
	padding-left:10px;
	width:297px;
	background:url(/myjtb/stage/eravelclub/images/ico_list.gif) no-repeat 0 6px;
}

/* search */
#main_container .searchflow{
	margin-top:30px;
}
#main_container .searchRight{
	float:right;
	display:inline;
	margin-right:10px;
	width:280px;
}
#main_container .searchLeft{
	float:left;
	display:inline;
	margin-left:10px;
	width:351px;
}

/* use */
#main_container .cardRight{
	float:right;
	display:inline;
	margin-right:10px;
	width:370px;
}
#main_container .cardLeft{
	float:left;
	display:inline;
	margin-left:10px;
	width:260px;
}

#main_container .useflow{
	margin-top:30px;
}
#main_container .useRight{
	float:right;
	display:inline;
	margin-right:10px;
	width:430px;
}
#main_container .useRight .mt15{
	margin-top:15px;
}
#main_container .useRight .mt30{
	margin-top:30px;
}
#main_container .useLeft{
	float:left;
	display:inline;
	margin-left:10px;
	width:198px;
}

#main_container .searchRight a,
#main_container .useRight a{
	padding-left:12px;
	background:url("/common/images/icon_arrow_right.gif") no-repeat 0 8px;
}
#main_container .eravelclublink{
	margin-top:40px;
	text-align:center;
}
#main_container .eravelclublink :hover img{
	opacity:0.7;
	filter: alpha(opacity=90);
	-ms-filter: "alpha( opacity=90 )";
	background: #fff;
}
#main_container .eravelclublinktxt{
	margin-top:10px;
	font-size:10px;
	text-align:center;
}

#main_container .att{
	margin-top:40px;
}
#main_container .att dt{
	color:#aa0000;
	font-weight:bold;
}

/* ============= contents_right ================= */
#contents_right{
	float:right;
	display:inline;
	width:260px;
}














/* /tabicd/css/common.css を元に截*/
#contents_area .cluster{
	line-height:1.5
}


#contents_area .cluster h3 {
    border: 1px solid #c0c0c0;
    border-bottom: 3px solid #bb0a34;
    border-radius: 4px 4px 0 0;
    padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
    background: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), color-stop(0.5, #f7f7f7), color-stop(0.5, #eaeaea), to(#eaeaea));
    background: -moz-linear-gradient(top, #f7f7f7,#f7f7f7 50%,#eaeaea 51%, #eaeaea);
    background: -ms-linear-gradient(top, #f7f7f7,#f7f7f7 50%,#eaeaea 51%, #eaeaea);
    position: relative;
}


#contents_area .cluster h3:before,
#contents_area .cluster h4:before{
    display: block;
    content: "";
    height: 14px;
    width: 8px;
    position: absolute;
    left: 2px;
    top: 4px;
    background: #bb0a34;
    border-radius: 3px;
}
#contents_area .cluster h3:before{
	content:none
}
#contents_area .cluster h3:after {
    content: "";
    display: block;
    width: 6px;
    height: 60%;
    background: #bb0a34;
    position: absolute;
    top: 20%;
    left: -1px;
}


#contents_area .cluster h4{
    border-bottom: 1px solid #bb0a34;
    position: relative;
}

#contents_area .cluster h4 span {
    display: block;
    border-bottom: 1px dotted #bb0a34;
    padding: 4px 10px 4px 18px;
    margin-bottom: 1px;
    font-weight: bold;
}

#contents_area .cluster h5{
    font-weight: bold;
    margin-bottom: 5px;
}


#contents_area .cluster .lead_text {
    margin-bottom: 20px;
}

.note {
	display: flex;
	gap: 2em;
	margin-top: 1em;
	margin-bottom: 1em;
	padding-left: 1em;
}

.noteText {
	width: calc(100% - (80px + 55px + 2em));
	padding-left: 1em;
	text-indent: -1em;
}

.noteText .kome {
	display: inline-block;
	width: 1em;
	text-indent: 0;
}

.noteImage {
	width: 80px;
	margin-right: 55px;
}

.noteImage img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}


#contents_area .cluster .bg_frame{
	padding: 15px;
	background: #ebebeb;
	position: relative;
}
#contents_area .cluster .bg_frame{
	width: 470px;
	float: left;
}
/* #contents_area .cluster div:nth-of-type(2) .around_img_right{
	margin-top:15px;
} */
#contents_area .cluster .bg_frame li {
	width: 200px;
	float: left;
	margin: 0 10px;
}





#contents_area .cluster .btns{
	display: inline-block;
    padding: 2px;
    font-size: 14px;
    position: relative;
}
#contents_area .cluster .btns.grayout {
	background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#999));
	background: -moz-linear-gradient(top, #ccc, #999);
	background: -ms-linear-gradient(top, #ccc, #999);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#999999);
	/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#999999)";*/
	color:#333;
	-webkit-box-shadow:1px 2px 2px rgba(255, 255, 255, 0.85);
    -moz-box-shadow:1px 2px 2px rgba(255, 255, 255, 0.85);
    box-shadow:1px 2px 2px rgba(255, 255, 255, 0.85);
	text-shadow: -1px -1px 0 #dcdcdc;
	cursor:default;
}

#contents_area .cluster .btns.grayout span,
#contents_area .cluster .btns2.grayout span{
	color:#333;
}

#contents_area .cluster .btns span,
#contents_area .cluster .btns2 span {
    display: inline-block;
	border:1px solid #fff;
	padding:8px 38px;
    border-radius: 4px;
}



#contents_area .cluster .btns:hover
#contents_area .cluster .btns2:hover {
	background: -webkit-gradient(linear, left top, left bottom, from(#e26a6a), to(#883f43));
	background: -moz-linear-gradient(top, #e26a6a, #883f43);
	background: -ms-linear-gradient(top, #e26a6a, #883f43);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#e26a6a, endColorstr=#883f43);
	/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#e26a6a, endColorstr=#883f43)";*/
	color:#fff;
	text-decoration:none
}

#contents_area .leisure_bnr a {
	display: block;
	position: relative;
	padding: 15px 5px;
	border-radius: 10px;
	font-size: 25px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	text-align: center;
	background-color: #B91137;
}

#contents_area .leisure_bnr a::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 30px;
	width: 10px;
	height: 10px;
	border-right: 2px solid;
	border-bottom: 2px solid;
	border-color: #fff;
	margin: auto;
	transform: rotate(-45deg);
}

#contents_area .leisure_bnr a:hover {
	opacity: .7;
}

#contents_area .leisure_bnr p {
	font-size: 18px;
}

.howto_wrap {
	margin-bottom: 20px;
}

.toggle {
	position: relative;
	width: 12em;
	padding: .5em 2em;
	margin-left: 10px;
	font-size: 1.2em;
	font-weight: bold;
	color: #fff;
	text-align: center;
	background-color: #bb0a34;
	cursor: pointer;
}

.toggle::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 1em;
	transform: translateY(-60%) rotate(45deg);
	width: 8px;
	height: 8px;
	border-right: 2px solid;
	border-bottom: 2px solid;
	border-color: #fff;
	font-size: 1.2em;
	transition: .5s;
}

.toggleContents {
	display: none;
}

.on::after {
	transform: translateY(-10%) rotate(-135deg);
}

.list_square li:before {
	display: none;
}

.around_img_right {
	text-align: center;
}

.around_img_right img {
	width: 60%;
}

.benefitStation {
	margin-top: 1em;
}

#contents_area .cluster .bg_frame {
	width: 60%;
}

#contents_area .cluster .bg_frame li {
	width: 146px;
	text-indent: -1em;
	padding-left: 1em;
}

#contents_area .cluster #howto > div:nth-of-type(2) .around_img_right {
	width: 35%;
	height: auto;
}

.btn_flex {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}

.btn_flex .btn_area {
	margin: 0 20px 0 0;
}

#how_search .box {
	margin-bottom: 0;
}

.term_block {
    display: flex;
    justify-content: space-between;
    margin: 2em 0;
    border: 1px solid #dfdfdf;
}
.term_block_title {
    width: 250px;
    background-color: #dfdfdf;
    padding: 20px 20px 10px;
}
.term_block_title p {
    display: flex;
    flex-direction: column;
    font-weight: bold;
    line-height: 1.8;
}
.term_block_description {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(100% - 260px);
    color: #C71429;
    font-size: 20px;
    font-weight: bold;
}

#contents_area a.link--txt {
    color: #29abe2;
    font-weight: bold;
    text-decoration: underline;
}

#contents_area a.link--txt:hover {
    text-decoration: none;
}

.link_pagetop {
	text-align: right;
}