/*============================================================================================================================================================
Common 
============================================================================================================================================================*/
.title-l {float:left; width:980px; line-height:24px; font-size:22px; font-family:'LogoTypeGothic'; padding:15px 0 10px 10px; }
.title-s {float:left; width:680px; line-height:24px; font-size:22px; font-family:'LogoTypeGothic'; padding:15px 0 10px 10px; }
.title-d-blue { background:url('/img/common/title_d_blue.png') repeat-x top; }
.title-blue { background:url('/img/common/title_blue.png') repeat-x top; }
.title-w-blue { background:url('/img/common/title_w_blue.png') repeat-x top; }
.title-icon { vertical-align:middle; margin-bottom:5px; }
.title-button { float:right; text-align:center; font-size:12px; color:#fff; padding:0 10px; font-family:'LogoTypeGothic'; }

.require {display:inline-block; position:relative; width:30px; margin-right:1px; background:#ff1472; font-size:10px; color:#fff; top:-3px; }

h2.result-area { float:left; font-size:30px; }

.b-bg-red { background:#ff5053; }
.b-bg-blue { background:#138dff; }
.b-bg-pink { background:#ff1472; }
.b-bg-orange { background:#ffcc66; }

.width130 {width:130px; }
.f-right {float:right; }

.bg-genre { background:#85c744; padding:0.5px 1px; color:#fff; border-radius:3px; }

.f-cl-red { color:#ff5053; }
.f-cl-blue { color:#138dff; }
.f-cl-pink { color:#ff1472; }
.f-cl-white { color:#ffffff; }
.f-cl-yellow { color:#ffff00; }
.f-cl-gray { color:#666666; }

.f9 { font-size:9px; }
.f10 { font-size:10px; }
.f12 { font-size:12px; }
.f14 { font-size:14px; }
.f16 { font-size:16px; }
.f22 { font-size:22px; }

.position-top2 {position:relative; top:-2px; }

.line-height20 {line-height:20px; }

.under-yellow { background: linear-gradient(transparent 90%, #faf44a 90%);}
.under { background: linear-gradient(transparent 50%, #a8eaff 50%);}
.under-catch { background: linear-gradient(transparent 50%, #ffe26c 50%);}

.padding1-2 { padding:1px 2px; }
.padding2-3 { padding:2px 3px; }

.d-hr {border-right:1px dotted #666; border-left:1px dotted #666; padding:0 5px; }

.bg-contents990 { float:left; width:968px; background:#fff; padding:10px; border:1px solid #ccc; }
.bg-contentsMovieTop { float:left; width:958px; background:#fff; padding:15px; border:1px solid #ccc; }
.bg-contents690 { float:left; width:668px; background:#fff; padding:10px; border:1px solid #ccc; }

/*============================================================================================================================================================
Button 
============================================================================================================================================================*/
button,
input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
}

.search-bt {
    border-radius: 5px;
    color: #fff;
    text-align: center;
    width:178px;
	display:block;
	font-size:20px; 
    line-height: 40px;
    margin: 0 auto;
	font-weight:normal; 
	font-family:'LogoTypeGothic'; 
}

.search-bt a {
    width: 170px;
    font-size: 18px;
    display: block;
    height: 35px;
    text-align: center;
    color: #fff;
    line-height: 40px;
    margin: 0 auto;
}

.search-bt:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(2px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}

.view-bt {
    border-radius: 5px;
    color: #fff;
    text-align: center;
    text-decoration: none;
}

.view-bt a {
    font-size: 18px;
    display: block;
    height: 35px;
    text-align: center;
    color: #fff;
    line-height: 40px;
    margin: 0 auto;
}

.view-bt:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(2px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}

.view-bt-free {
    border-radius: 5px;
    color: #fff;
    text-align: center;
    text-decoration: none;
}

.view-bt-free a {
    font-size: 14px;
    display: block;
    text-align: center;
    color: #fff;
    line-height: 30px;
    margin: 0 auto;
}

.view-bt-free:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(2px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}

.arrival {  
	-moz-box-shadow: 0px 3px 0px #be3500;
    -webkit-box-shadow: 0px 3px 0px #be3500;
    box-shadow: 0px 3px 0px #be3500;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: #ff5e20;
    border-bottom: solid 1px #ff5e20;
}

.search-confirm {  
	-moz-box-shadow: 0px 3px 0px #0063be;
    -webkit-box-shadow: 0px 3px 0px #0063be;
    box-shadow: 0px 3px 0px #0063be;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: #2094ff;
    border-bottom: solid 1px #2094ff;
}

.view-confirm {  
	-moz-box-shadow: 0px 3px 0px #0063be;
    -webkit-box-shadow: 0px 3px 0px #0063be;
    box-shadow: 0px 3px 0px #0063be;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: #2094ff;
    border-bottom: solid 1px #0063be;
}

.contact-bt {
    border-radius: 5px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    width:173px;
	margin:10px; 
}

.contact-bt a {
    width: 165px;
    font-size: 18px;
    display: block;
    height: 35px;
    text-align: center;
    color: #fff;
    line-height: 40px;
    margin: 0 auto;
}

.contact-bt:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(2px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}


.bt-form {
    border-radius: 5px;
    color: #fff;
    text-align: center;
    width:178px;
    display: inline-block;
	font-size:20px; 
    line-height: 40px;
    margin: 0 auto;
	font-weight:normal; 
	font-family:'LogoTypeGothic'; 
}

.back-bt {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 -1px 0 0 #d8d2c5 inset;
    -webkit-box-shadow: 0 -1px 0 0 #d8d2c5 inset;
	font-size:20px; 
	width:178px;
    line-height: 40px;
    background: #fef9ef;
    display: inline-block;
    text-decoration: none;
    border: solid 1px #d8d2c5;
    text-align: center;
    color: #666;
	font-family:'LogoTypeGothic'; 
}


.back-bt:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(2px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}

.form-confirm {  
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 -1px 0 0 #be001a inset;
    -webkit-box-shadow: 0 -1px 0 0 #be001a inset;
    background: #ff203f;
    border-bottom: solid 1px #ff203f;
	font-size:20px; 
	width:178px;
    line-height: 40px;
	color:#fff;
	font-family:'LogoTypeGothic'; 
    display: inline-block;
    text-decoration: none;
}

.form-confirm:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(2px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}


/*============================================================================================================================================================
Shop title 
============================================================================================================================================================*/
.shop-title {height:20px; 
position: relative;
width:975px;
line-height:24px; font-size:22px; font-family:'LogoTypeGothic'; padding:3px 0 10px 10px; 
border-left: solid 5px #208eff;
float:right;
}

.shop-title span {
	float:right;
	padding:2px 5px;
	text-align:center; 
	background:#208eff;
	font-size:10px;
	border-radius:3px;
}
.shop-title span a {
	color:#fff;
}

.shop-title:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 5px;
background: -webkit-repeating-linear-gradient(-45deg, #208eff, #208eff 2px, #fff 2px, #fff 4px);
background: repeating-linear-gradient(-45deg, #208eff, #208eff 2px, #fff 2px, #fff 4px);
}

/*============================================================================================================================================================
Side Area css 
============================================================================================================================================================*/
.side-search-body dd {position: relative;}
.side-search-body dd a {width:100%; display:block; }
.search-option-wrapper {
	display:none; 
	position:absolute; 
	margin:-100px 0 0 185px; 
	z-index:102; 
	box-sizing: border-box; 
	width:1000px;
}

.search-option { 
	position: relative;
	margin-left:10px;
}

.search-option-list {float:left; position: relative; color:#222; padding:20px; border: 2px solid #c1c1c1; background:#fff;}
.step1-wrapper {float:left; width:100%;}
.step1-wrapper .step1 {float:left; width:100%; }
.step1-wrapper .step1 .all-check {float:right; display: block;margin: 3px 4px 0 0; background: #fff; border-radius: 2px; font-size:14px; font-weight:normal; }
.step2-wrapper {float:left; width:100%; margin-bottom:10px; }
.step2-wrapper li {float:left; width:23%; font-size:14px; padding:0.5% 1%;}
.step2-wrapper li:hover  {background:#efefef;}

.step-area {
	color: #333; text-shadow: 0 0 5px white; border-left: solid 7px #588fe3; padding:3px; font-size:16px; font-weight:bold; margin-bottom:10px; 
	background: -webkit-repeating-linear-gradient(-45deg, #b3cdff, #b3cdff 2px,#dde9ff 2px, #dde9ff 7px);
	background: repeating-linear-gradient(-45deg, #b3cdff, #b3cdff 2px,#dde9ff 2px, #dde9ff 7px); 
}
.step-genre {
	color: #333; text-shadow: 0 0 5px white; border-left: solid 7px #3aaade; padding:3px; font-size:16px; font-weight:bold; margin-bottom:10px; 
	background: -webkit-repeating-linear-gradient(-45deg, #b3e2ff, #b3e2ff 2px,#ddf2ff 2px, #ddf2ff 7px);
	background: repeating-linear-gradient(-45deg, #b3e2ff, #b3e2ff 2px,#ddf2ff 2px, #ddf2ff 7px); 
}
.step-kodawari {
	color: #333; text-shadow: 0 0 5px white; border-left: solid 7px #27c0dc; padding:3px; font-size:16px; font-weight:bold; margin-bottom:10px; 
	background: -webkit-repeating-linear-gradient(-45deg, #b3f2ff, #b3f2ff 2px,#ddfaff 2px, #ddfaff 7px);
	background: repeating-linear-gradient(-45deg, #b3f2ff, #b3f2ff 2px,#ddfaff 2px, #ddfaff 7px); 
}

/* css checkbox01 */
.checkbox-area{
  display: none;
}
.checkbox-parts{
  padding-left: 20px;
  position:relative;
  margin-right: 20px;
}
.checkbox-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #999;
  border-radius: 2px;
}
.checkbox-area:checked + .checkbox-parts{
  color: #ff3366;
}
.checkbox-area:checked + .checkbox-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #ff3366;
  border-right: 3px solid #ff3366;
}


.search-option-list:after, .search-option-list:before {
	right: 100%;
	top: 90px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.search-option-list:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #ffffff;
	border-width: 10px;
	margin-top: -10px;
}
.search-option-list:before {
	border-color: rgba(193, 193, 193, 0);
	border-right-color: #c1c1c1;
	border-width: 13px;
	margin-top: -13px;
}