@charset "UTF-8";

/* main  ------------------------------*/
#main {
	padding:20px 0;
    background-color: #ffffff;
}
#main p{
	margin-bottom:1rem;
}


/* Font  ------------------------------*/
h3{
	margin-top: 2rem;	
}
h4{
	padding:0.5rem;
}

#faq ul,
#faq ol{
	margin-bottom: 1rem;
}
.accordion.qa > dt{
	padding:1rem 1rem 1rem 3rem;
	background: url(/images/site/i_q.png) left 0.75rem no-repeat;
}
.accordion.qa > dd{
	padding:1rem 1rem 1rem 3rem;
	background: url(/images/site/i_a.png) 0.25rem 0.75rem no-repeat;
	border-left: 5px solid #FFDD00;
	margin-bottom: 1rem;
}
.accordion.qa > dt:hover{
	background-color:#fafafa; 
}

/* Alcohol  ------------------------------*/
#alcohol th{
	width:8rem;
	background:#f5f5f5;
}
@media(min-width:768px) {
	#alcohol th{
		width:14rem;
	}
}

/* Tokutei  ------------------------------*/
#tokutei th{
	width:7rem;
	background:#f5f5f5;
}

.toku ul{
	background: url(/images/site/icon_tokutyou.gif) left top no-repeat;
	padding-left:110px;
	margin-left: 0;
}


#join li{
	text-align: center;
	padding: 1rem 1rem  2rem  1rem;
	border-bottom: 1px solid #EEE;
	background: url(/images/i_accordion_dt_down.png) bottom center no-repeat;
	
}
#join li:last-child{
	background:none;
	border:none;
}

/* Inquiry  ------------------------------*/
#inquiry .l{
    width: 670px;
    padding:20px;
    float: left;
}
#inquiry .r{
	width: 300px;
	float: right;
}
#inquiry .r h3{
	margin-top: 1rem;	
	padding-left:2rem;
	color:#62B0B4;
	background: url(/images/site/i_q.png) left center  no-repeat;
}
#inquiry .r h4{
	font-size:1rem;
	padding:0.2rem 0.5rem;
	margin:0;
	color:#FFF;
	background-color: #8ECBCC;
}
#inquiry .r dt,
#inquiry .r dd{
	font-size:0.9rem;
	padding: 0.5rem;
}
#inquiry .r dt{
	padding-right:1.5rem ;
}

/* Search  ------------------------------*/
#search  h3.border{
	font-size:1.5rem;
	margin: 0 1rem 21px 0;
	padding-top:25px;
	display: inline-block;
	width:100%;
}
#search  h3.border span{
	color:#999;	
}
#search  h3.border span#searchResultsCount {
	color:#0080d4;
}
#search a:hover{
	text-decoration: none;
}

#search label{
	white-space: nowrap;
	font-size: 80%;
	line-height:1.3em;
}
#search .close a{
	color:#000;
	font-weight: normal;
	font-size: 0.8rem;
}
#search .close a:hover{
	text-decoration: none;
}
#search .close{
	margin-right:0.8rem;
	margin-bottom:0.8rem;
	background-color: #fafafa;

}
#search .close em{
	margin-left: 5px;
	color: #c9c9c9;
}

#search .item{
}
#search .b_submit{
	margin-bottom: 2rem;
}
	
#search .col5 dl{
	float: left;
	margin-right: 1rem;
}
#search .col5  dt{
	padding:0 0.5rem;
	border-bottom:2px solid #0A3C41;
}
#search .col5 label{
	display: block;
	padding:0.2rem 0.5rem;
	margin: 0;
	border-bottom:1px solid #eaeaea;
}
#search .l {
	float: left;
	width: 255px;
	padding-top: 20px;
	padding-bottom: 20px;
	position: relative;
}

#search .r {
    float: right;
    width: 730px;
}

#search .l h4 {
	background-color: #f5f5f5;
	font-size: 0.9rem;
	padding: 0.3rem;
	margin-top:1.1rem;
	color:#333;
}

#search .arrow {
    background-image: url(../images/arrow02.png);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 20px, 100%;
}

.search-tag{
    margin-bottom: 1.4rem;
}
.search-tit{
	border-bottom: 1px solid #eaeaea;
    font-size: 1.5rem;
    padding-bottom: 10px;
}
.search-tit h2 em {
    border-bottom: 2px solid #0A3C41;
    padding: 0 1rem 4px;
}

.search-box #searchForm h4{
	margin-top: 0;
}
.search-box input {
    border: medium none;
    vertical-align: middle;
	width:100%;
	font-size:85%;
	box-sizing: border-box;
}
.search-box input.b_search {
	background: rgba(0, 0, 0, 0) url("../images/b_search_bg.png") no-repeat scroll -20px 0;
	font-size: 0;
	height: 20px;
	width: 20px;
	margin-left: 9px;
}
.search-box input.b_search:hover {
	cursor: pointer;
}
.search-category {
	position: absolute;
	left: 260px;
	background-color: #F5F5F5;
	z-index: 1;
	margin-top: 0.6rem;
	top: 178px;
	display: none;
	float: left;
	width: 660px;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
	border:1px solid #eaeaea;
	padding-top: 0rem;
	padding-right: 0.4rem;
	padding-bottom: 1.6rem;
	padding-left: 1.6rem;
}

.search-gift {
	position: absolute;
	left: 260px;
	background-color: #f5f5f5;
	z-index: 1;
	margin-top:0.6rem;
	top: 353px;
	display:none;
	float: left;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.1); 
	border:1px solid #eaeaea;
	padding-top: 0rem;
	padding-right: 0.4rem;
	padding-bottom: 1.6rem;
	padding-left: 1.6rem;
}
.search-series {
	position: absolute;
	left: 260px;
	background-color: #f5f5f5;
	z-index: 1;
	margin-top:0.6rem;
	top: 130px;
	display:none;
	float: left;
	width:660px;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.1); 
	border:1px solid #eaeaea;
	padding-top: 0rem;
	padding-right: 0.4rem;
	padding-bottom: 1.6rem;
	padding-left: 1.6rem;
}
.search-sdgs {
	position: absolute;
	left: 260px;
	background-color: #f5f5f5;
	z-index: 1;
	margin-top:0.6rem;
	top: 290px;
	display:none;
	float: left;
	width:660px;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.1); 
	border:1px solid #eaeaea;
	padding-top: 0rem;
	padding-right: 0.4rem;
	padding-bottom: 0.8rem;
	padding-left: 1.6rem;
}

.search-category-close {
	font-size: 20px;
	text-align: right;
}
.submenu-close {
	cursor: pointer;
}
.select-box01{
	border-radius: 0!important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url(../images/arrow01.png) right 50% no-repeat;
	width: 160px;
	background-size: 20px, 100%;
	float:right;
	border: 1px solid #E1E1E1;
	padding-top: 1px;
	padding-right: 5px;
	padding-left: 10px;
	font-size: 0.85rem;
}




/*Radio Check*/
label.radio, label.radio_text, label.checkbox, label.checkbox_text {
	position      : relative;
	cursor        : pointer;
	display       : inline-block;
	overflow      : hidden;
	box-sizing    : border-box;
}
label.radio {
	width         : 16px;
	height        : 16px;
	border        : 1px solid #666666;
	border-radius : 100%;
}
label.radio_text {
	min-height   : calc(16px + 5px);
	margin-right : calc(16px + 5px);
	padding-left : calc(16px + 5px);
	line-height  : calc(16px + 5px);
}
label.checkbox {
	width      : 16px;
	height     : 16px;
	border     : 1px solid #B3B3B3;
	background : #fff;
}
label.checkbox_text {
	padding-left : calc(16px + 5px);
	line-height  : 16px;
}
/** before after **/
label.radio:before, label.radio_text:before, label.checkbox_text:before,
label.checkbox:after, label.radio_text:after, label.checkbox_text:after{
	content  : '';
	position : absolute;
	box-sizing : border-box;
}
label.radio:before, label.radio_text:before{
	border-radius    : 100%;
}
label.radio:before, label.checkbox:after{
	top              : 0px;
	bottom           : 0px;
	left             : 0px;
	right            : 0px;
	margin           : auto;
}
label.checkbox:after, label.checkbox_text:after{
	transform         : rotate(45deg);
	-webkit-transform : rotate(45deg);
	-moz-transform    : rotate(45deg);
	border-right      : 1px solid #0A3C41;
	border-bottom     : 1px solid #0A3C41;
	top               : calc(50% - (((10px / 12 ) * 5) / 2));
	display           : block;
	margin-top        : calc(((10px / 12 ) * 5) * -1);
	width             : calc(((10px / 12 ) * 5));
	height            : 10px;
	z-index           : 1;
}
label.radio_text:before, label.radio_text:after{
	top              : 0px;
	bottom           : 0px;
	margin-top       : auto;
	margin-bottom    : auto;
}
label.radio:before {
	display          : block;
	width            : 10px;
	height           : 10px;
	z-index          : 1;
	background-color : #0A3C41; 
}
label.radio_text:before {
	width         : 16px;
	height        : 16px;
	border        : 1px solid #666666;
	left          : 0px;
	z-index       : 3;
	
}
label.checkbox_text:before {
	width    : 16px;
	height   : 16px;
	left     : 0px;
	top      : 0;
	border   : 1px solid #B3B3B3;
	z-index  : 3;
	box-sizing: border-box;
}
label.radio_text:after {
	width            : 10px;
	height           : 10px;
	border-radius    : 100%;
	left             : calc(((16px/2) - (10px) / 2));
	background-color : #0A3C41;
	z-index          : 1;
}
label.checkbox_text:after {
	left : calc((16px / 2) - (((10px / 12 ) * 5) / 2));
}
/** input **/
label.radio input[type="radio"], label.radio_text input[type="radio"], label.checkbox input[type="checkbox"], label.checkbox_text input[type="checkbox"]{
	-moz-appearance: none;
	-webkit-appearance: none;
	position   : absolute;
	z-index    : 2;
	margin     : 0px;
	width      : 16px;
	height     : 16px;
	box-sizing    : border-box;
	outline       : none;
}
label.radio input[type="radio"], label.radio_text input[type="radio"]{
	left       : calc(16px * -1);
	width      : 16px;
	height     : 16px;
	top           : 0px;
	bottom        : 0px;
	margin-top    : auto;
	margin-bottom : auto;
	border-radius : 100%;
}
label.checkbox input[type="checkbox"], label.checkbox_text input[type="checkbox"]{
	left       : calc(16px * -1);
	padding    : 0;
}
label.radio input[type="radio"] {
	display    : block;
	box-shadow : 16px 0px #FFF;
}
label.radio_text input[type="radio"] {
	box-shadow : 16px 0px #FFF;
}
label.checkbox input[type="checkbox"] {
	box-shadow : 16px 0px #FFF;
}
label.checkbox_text input[type="checkbox"] {
	display    : block;
	box-shadow : 16px 0px #FFF;
}
/** checked forcus */
label.checkbox_text input[type="checkbox"]:checked,
label.checkbox input[type="checkbox"]:checked,
label.radio_text input[type="radio"]:checked,
label.radio input[type="radio"]:checked{
	box-shadow : none;
}
label.checkbox_text input[type="checkbox"]:checked:focus,
label.checkbox input[type="checkbox"]:checked:focus{
	opacity: 0.1;
}
label.radio_text input[type="radio"]:focus,
label.radio input[type="radio"]:focus{
	opacity: 0.2;
}

label.checkbox_text input[type="checkbox"]:checked:focus {
	box-shadow : 16px 0px #FFF;
}
label.checkbox_text input[type="checkbox"]:focus {
	box-shadow : 16px 0px #FFF;
}
label.checkbox input[type="checkbox"]:checked:focus {
	box-shadow : 16px 0px #FFF;
}
label.checkbox input[type="checkbox"]:focus {
	box-shadow : 16px 0px #FFF;
}
label.radio_text input[type="radio"]:focus {
	box-shadow : 16px 0px #FFF;
}
label.radio input[type="radio"]:focus {
	box-shadow : 16px 0px #FFF;
}

#search .block2{
	width: 120px;
	display: inline-block;
	line-height:18px;
}
#search .noblock{
	line-height:18px;
	width:320px;
}
.item .g {
    margin: 2rem 0;
    width: 100%;
}
/** resutlts **/
.results-show{
	display: block;
}
.results-hide{
	display: none;
}
.pagelink a.on {
	background-color: #0068b7;
}

/* Guide  ------------------------------*/
#guide h5{    
  border-bottom: 1px solid #eaeaea;
  font-weight: bold;
  padding-bottom:0.5rem;
  margin-bottom:0.8rem;
}
#guide h6{    
  color: #0068b7;
  font-weight: bold;
}
#guide p{
	margin-bottom:2rem;
}
#guide .index{
	margin-top:2rem;
	height:400px;
}
#guide .index_left{
	width: 310px;
	float: left;
	margin-right:2rem;
}
#guide .index_middle{
	width: 310px;
	float: left;
	margin-right:2rem;
}
#guide .index_right{
	width: 310px;
	float: left;
}

#guide .index a{
	color:#000;
}
#guide td{
	padding-top:1rem;
}
#guide tbody, tbody th, tbody, tbody td{
	border:none;
	vertical-align:top;
}
#guide .purchase{
	margin-bottom:2.5rem;
	float:left;
	width:100%;
}
#guide .purchase dt{
  width : 150px;
  float : left;
  clear : both;
}

#guide .settlement{
	margin-bottom:1.5rem;
	float:left;
	width:487px;
	margin-right:1rem;
}
#guide .settlement dt{
  width : 140px;
  float : left;
  clear : both;
}

#guide .border{
	border: 1px solid #0A3C41;
	-ms-interpolation-mode: bicubic;
}

#guide .border img {
	-ms-interpolation-mode: bicubic;
	}
	
.margin-b20 {
	margin-bottom:2rem;
}

.margin-t10 {
	margin-top:1rem;
}

.margin-t20 {
	margin-top:2rem;
}

.margin-t40 {
	margin-top:4rem;
}

.margin-r20 {
	margin-right:2rem;
}

.step {
	position: relative;
    padding: 10px 5px 7px 70px;
    margin-bottom:2rem;
    margin-top:2.5rem;
}
.step1:before {
    background: #0A3C41;
    border-radius: 50%;
    content: '';
	background-image: url(/images/site/guide_step1.png);
	background-repeat: no-repeat;
	background-position: center center;
    height: 65px;
    left: -6px;
    line-height: 100px;
    position: absolute;
    text-align: center;
    top: -30%;
    width: 65px;
}
.step2:before {
    background: #0A3C41;
    border-radius: 50%;
    content:'';
	background-image: url(/images/site/guide_step2.png);
	background-repeat: no-repeat;
	background-position: center center;
    height: 65px;
    left: -6px;
    line-height: 100px;
    position: absolute;
    text-align: center;
    top: -30%;
    width: 65px;
}
.step3:before {
    background: #0A3C41;
    border-radius: 50%;
    content: '';
	background-image: url(/images/site/guide_step3.png);
	background-repeat: no-repeat;
	background-position: center center;
    height: 65px;
    left: -6px;
    line-height: 100px;
    position: absolute;
    text-align: center;
    top: -30%;
    width: 65px;
}
.attention {
	font-size: 1rem;
	font-weight: bold;
	width: 100%;
	margin-bottom: 1rem;
}

.about_btn .l {
    float: left;
    width: 505px;
}
.about_btn .r {
    float: right;
    width: 505px;
}


#btnMsgBox {
	position: fixed;
	top: 50%;
	left: 40%;
	width: 20%;
	height: 60px;
	line-height: 60px;
	margin-top: -30px;
	border-radius: 2px;
	text-align: center;
	background-color: rgba(0,0,0,0.5);
	color: #fff;
	border-bottom: 1px solid rgba(204, 204, 204, 0.5);
	box-shadow: 0 0 6px #ccc;
}

/* FAQ  ------------------------------*/
.moreinfo {
	width: 250px;
	text-align: center;
	margin: 25px auto 0 auto;
	padding: 5px 15px;
	background: #8ECBCC;
	color: #fff;
	border-radius: 3px;
}

.moreinfo:hover {
	opacity: 0.8;
	cursor: pointer;
}

.moreinfo + *{
	display: none;
}