@charset "utf-8";
/* CSS Document */

/*==================================================
下層ページ共通
================================================== */



@media only screen and (max-width: 650px) {


	
}




/*==================================================
ページリスト(.PageList)
================================================== */

.PageList {text-align:center; clear: both; margin: 25px 0; }
.PageList ul {}
.PageList ul li {display: inline-block; margin: 0 10px 20px 0;}
.PageList ul li.now { /* 現在のページ */}
.PageList ul li a,
.PageList ul li.active a{
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 6px; 
    text-decoration: none; 
	background: #fff;
	color: #333;
	line-height: 1;
    border: 1px solid #ccc;
	font-size: 13px;
}

.PageList ul li.link-prev a,
.PageList ul li.link-next a{
	background: #00048b;
	border-color: #00048b;
	color: #fff;
}
.PageList ul li a, 
.PageList ul li a:link, 
.PageList ul li a:visited {}
.PageList ul li.active a,
.PageList ul li a:hover{
    border: 1px solid #00048b;
    background: #00048b;
	color: #fff;
}

#PageList-info-up{
	text-align: right;
}

#PageList-info-bottom{
	padding-top: 50px;
}

@media (max-width: 480px) {
    
.PageList {margin: 30px 0 0; }
.PageList ul li {margin: 0 5px 15px 0;}
.PageList ul li a,
.PageList ul li.active span{
    width: 38px !important;
    height: 38px !important;
}

#PageList-info-up{
	text-align: center;
}

#PageList-info-bottom{
	padding-top: 50px;
}
	

}

/*==================================================
list
================================================== */

#item-list .title-basic{
	position: relative;
	text-align: left;
	padding-left: 15px;
	font-weight: normal;
}

#item-list .title-basic select{
	position: absolute;
	right: 15px;
	top: 10px;
	height: 24px;
	background: #fff;
	width: auto;
	border: none;
	padding: 0 10px;
}

.list-product-price{
	margin: 0 !important;
	font-size: 20px;
}

.list-product-price small{
	font-size: 12px;
}

.list-product-data{
	margin-top: 10px;
	background: #eaeaea;
	padding: 6px;
	font-size: 12px;
}

.list-search{
	display: table;
	width: 100%;
	margin-bottom: 25px;
}

.list-search p{
	display: table-cell;
	vertical-align: top;
	width: 13%;
}

#lang-en .list-search p{
	width: 22%;
}

.word{
	display: table-cell;
	width: 87%;
	vertical-align: top;
}

#lang-en .word{
	width: 78%;
}

.word a.tag{
	position: relative;
	width: auto;
	padding-left: 10px;
	padding-right: 30px;
	margin-right: 7px;
	margin-bottom: 12px;
	color: #624797;
	text-decoration: none !important;
}

.word a.tag.tag-all{
	border:none;
	color: #333;
	padding-right: 10px;
	font-size: 14px;
	pointer-events: none;
}

.word a.tag:hover{
	color: #fff;
	background: #624797;
}

.word .tag i{
	position: absolute;
	right: 5px;
	font-size: 10px;
	top: 50%;
	margin-top: -5px;
	color: #e0daea;
}

.txt-result-0{
	text-align: center;
	font-size: 20px;
	font-weight: 600;
	margin: 50px 0;
}

@media only screen and (max-width: 480px) {

#item-list .title-basic{
	box-sizing: border-box;
	padding: 12px 10px 40px 10px;
	margin-bottom: 20px;
}

#item-list .title-basic select{
	font-size: 11px;
	padding: 0 2px;
	right: 8px;
	top:inherit;
	bottom:10px;
}

#item-list ul{
}

.list-product-price{
	font-size: 18px;
}

.list-product-price small{
	font-size: 11px;
}

.list-product-data{
	padding: 5px;
	font-size: 11px;
}

.list-search{
	display: block;
	margin-bottom: 20px;
}

.list-search p, #lang-en .list-search p{
	display: block;
	width: 100%;
	margin: 0 0 5px;
}

.word, #lang-en .word{
	display: block;
	width: 100%;
}

.word .tag{
	padding-left: 10px;
	padding-right: 20px;
	margin-right: 5px;
	margin-bottom: 8px;
}

.txt-result-0{
	font-size: 15px;
	margin: 35px 0;
}
	
}

/*==================================================
detail
================================================== */

#item-info{
	position: relative;
}

#item-img{
	width: 452px;
}

#item-info-header{
	position: absolute;
	top: 0;
	left: 520px;
}

.item-category{
	font-size: 16px;
	margin-bottom:0 !important;
}

.item-name{
	display: block;
	font-size: 25px;
	margin: 5px 0 25px;
	line-height:1.3;
}

.item-price{
	font-size: 16px;
	margin-bottom:0 !important;
}

.item-price small{
	font-size: 20px;
}

#item-info-basic{
	position: absolute;
	top: 235px;
	left: 520px;
}

#item-info-basic ul{
	list-style: none;
}

#item-info-basic ul li{
	display: flex;
	vertical-align: middle;
	margin-bottom: 12px;
}

#item-info-basic ul li span{
	display: inline-block;
	width: 120px;
	background: #624797;
	font-size: 12px;
	color: #fff;
	padding: 3px 0;
	text-align: center;
	margin-right: 15px;
	border-radius: 6px;
	font-weight: 600;
}

#item-movie{
	background: #fff;
	padding: 35px 35px 5px;
	margin-bottom: 35px;
}

.movie-file{
	width: 100%;
	height: 478px;
	vertical-align: bottom;
	object-fit:cover;
}

#item-detail{
	background: #fff;
	padding: 35px;
}

.ul-bt{
	list-style: none;
}

.ul-bt li{
	border-top: 1px solid #ccc;
	padding: 15px 0;
	display: flex;
}

.ul-bt li span{
	padding: 0 20px 0 15px;
	width: 120px;
	font-weight: 600;
}

@media only screen and (max-width: 480px) {

#item-info{
}

#item-img{
	width: 100%;
}
	
#item-img .btn-area{
    display: none;
}

#item-info-header{
	position: relative;
	top: inherit;
	left: inherit;
	margin-bottom: 20px;
}

.item-category{
	font-size: 11px;
}

.item-name{
	font-size: 20px;
	margin: 10px 0 20px;
}

.item-price{
	font-size: 20px;
}

.item-price small{
	font-size: 14px;
}

#item-info-basic{
	position: relative;
	top: inherit;
	left: inherit;
	padding-bottom: 25px;
}

#item-info-basic ul li{
	display: flex;
	vertical-align: middle;
	margin-bottom: 12px;
}

#item-info-basic ul li span{
	width: 100px;
	font-size: 11px;
	margin-right: 10px;
}

#item-movie{
	padding: 25px 20px 15px;
	box-sizing: border-box;
	margin-bottom: 25px;
}
	
#item-movie .btn-area{
    display: none;
}
	
.movie-file{
	height: 45vw;
}	

#item-detail{
	padding: 25px 20px ;
	box-sizing: border-box;
}

.ul-bt li{
	display: block;
}

.ul-bt li span{
	display: block;
	padding: 0;
	width: 100%;
}
	
}

/*==================================================
terms
================================================== */

#terms{
	line-height: 1.8;
}

#terms-header{
	margin-bottom: 35px;
}

#terms-body article{
	border-top: 1px solid #ccc;
	padding-top: 35px;
	margin-bottom: 35px;
}

#terms-body article h4{
	display: block;
	font-size: 24px;
	margin-bottom: 30px;
	font-weight: normal;
}

.ol-normal{
	margin-left: 17px;
}

.ol-kan{
	list-style-type: cjk-ideographic;
	margin-left: 27px;
}

.ol-rome{
	list-style-type: upper-roman;
	margin-left: 27px;
}

.txt-right{
	text-align: right;
}

@media only screen and (max-width: 480px) {

#terms{
	line-height: 1.6;
}

#terms-header{
	margin-bottom: 25px;
}

#terms-body article{
	padding-top: 30px;
	margin-bottom: 25px;
}

#terms-body article h4{
	font-size: 18px;
	margin-bottom: 25px;
}

.ol-normal{
	margin-left: 17px;
}

.ol-kan{
	list-style-type: cjk-ideographic;
	margin-left: 27px;
}

.txt-right{
	text-align: right;
}
	
}

/*==================================================
お知らせ詳細
================================================== */

.title-information{
	display: block;
	font-size: 28px;
	font-weight: 600;
	border-bottom: 1px solid #ccc;
	padding: 0 0 15px;
	margin-bottom: 10px;
}

.header-information .date{
	text-align: right;
	color: #999;
	font-size: 14px;
	font-weight: 600;
}

.body-information{
	margin: 35px 0 80px;
	line-height: 1.9;
}

.body-information p{
	margin-bottom: 30px;
}

.ul-basic{
	margin: 0 0 30px 20px;
}

#add{
	margin: 80px 0;
}

@media only screen and (max-width: 480px) {

.title-information{
	font-size: 20px;
}

.header-information .date{
	font-size: 12px;
}

.body-information{
	margin: 35px 0 50px;
	line-height: 1.7;
}

#add{
	margin: 50px 0 0;
}
	
}

.box-movie .btn-area{
	margin: 25px 0;
}

/*==================================================
LogIn
================================================== */

#LogIn{
	padding: 35px 0;
}

.box-form{
	width: 720px;
	margin: 0 auto;
}

.dl-form dt{
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 10px;
}

.dl-form dd{
	font-size: 18px;
	margin-bottom: 30px;
}

.box-form .btn{
	margin-bottom: 15px;
}

.box-error-txt{
	text-align: center;
	margin-bottom: 50px;
}

.box-error-txt span{
	display: inline-block;
	background: #fff;
	color: #ff0000;
	font-size: 20px;
	padding: 15px 50px;
	border: 2px solid #ff0000;
	font-weight: 600;
}

.check-login{
	text-align: center;
	margin-bottom: 70px;
}

@media only screen and (max-width: 480px) {

#LogIn{
	padding: 15px 0;
}

.box-form{
	width: 100%;
}

.dl-form dt{
	font-size: 13px;
}

.dl-form dd{
	font-size: 13px;
}

.box-error-txt{
	margin-bottom: 35px;
}

.box-error-txt span{
	display: inline-block;
	font-size: 15px;
	padding: 12px 20px;
}

.check-login{
	margin-bottom: 50px;
}
	
}

/*==================================================
Password-Remind
================================================== */

#Password-Remind{
	padding: 35px 0;
}

#Password-Remind .btn{
	width: 460px;
}

#Password-Remind .box-form > p{
	text-align: center;
	margin-bottom: 50px;
	font-size: 20px;
}

#Password-Remind.Password-Remind-Fin{
	padding-top: 100px;
}

#Password-Remind.Password-Remind-Fin .btn{
	width: 360px;
}

@media only screen and (max-width: 480px) {

#Password-Remind{
	padding: 15px 0;
}

#Password-Remind .btn{
	width: 100%;
}

#Password-Remind .box-form > p{
	margin-bottom: 35px;
	font-size: 16px;
}

#Password-Remind.Password-Remind-Fin{
	padding-top: 60px;
}

#Password-Remind.Password-Remind-Fin .btn{
	width: 100%;
}
	
}

/*==================================================
Support
================================================== */

/*タブのスタイル*/
#Support .tab_item {
    width: 445px;
    height: 59px;
    border: none;
    background-color: #eaeaea;
    line-height: 59px;
    font-size: 18px;
    color: #999;
    display: block;
	border-radius: 0;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	margin-right: 0 !important;
	float: left;
}

#Support #label-howtosearch{
	margin-right: 0 !important;
	float: right;
}

/*ラジオボタンを全て消す*/
#Support input[name="tab_item"] {
  display: none !important;
}

/*タブ切り替えの中身のスタイル*/
#Support .tab_content {
  display: none;
	clear: both;
	padding: 50px;
	background: #fff;
}

/*選択されているタブのコンテンツのみを表示*/
#pwchange:checked ~ #pwchange_content,
#howtosearch:checked ~ #howtosearch_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
#Support .tabs input:checked + .tab_item {
  background-color: #fff;
  color: #333;
}


.box-support{
	padding-bottom: 35px;
	margin-bottom: 35px;
	border-bottom: 1px solid #ccc;
}

.box-support h4{
	display: block;
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 35px;
}

.img-support{
	width: 400px;
	float: left;
}

.img-support img{
	width: 100%;
	vertical-align: bottom;
}

.txt-support{
	width: 370px;
	float: right;
	line-height: 2.0;
}

@media only screen and (max-width: 480px) {

/*タブのスタイル*/
#Support .tab_item {
    width: 50%;
    height: 42px;
    line-height: 42px;
    font-size: 12px;
}

/*タブ切り替えの中身のスタイル*/
#Support .tab_content {
	padding: 25px 20px;
}


.box-support{
	padding-bottom: 5px;
	margin-bottom: 25px;
}

.box-support h4{
	font-size: 16px;
	margin-bottom: 15px;
}

.img-support{
	width: 100%;
	float: none;
	padding-bottom: 20px;
}

.txt-support{
	width: 100%;
	float: none;
	line-height: 2.0;
}
	
}

/*==================================================
Password-Change
================================================== */

#Password-Change .box-form{
	width: 100%;
}

#Password-Change .box-form .dl-form{
	margin: 0 auto;
	width: 90%;
}

@media only screen and (max-width: 480px) {

	
}



/*==================================================
form
================================================== */

input[type="text"],
input[type="number"], 
input[type="email"], 
input[type="password"] , 
input[type="tel"] ,
input[type="date"] ,
input[type="time"] ,
input[type="search"]  {
	width: 100%;
    box-sizing: border-box;
	height:60px;
	padding:5px 8px;
	background:#fff;
	border: none;
	border-radius: 6px;
	font-size: 18px;
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="search"]:focus,
textarea:focus {
background:#eee; 
}

textarea{
	min-height:240px;
	padding:5px 8px;
	width:100%;
    box-sizing: border-box;
	background:#fff;
	border: none;
	border-radius: 6px;
	font-size: 18px;
}

::placeholder{
	color: #999;
	font-size: 18px;
}

input[type="checkbox"]{
    display: inline-block; 
    width: 22px; 
    height: 22px; 
    background:#f5f5f5; 
    vertical-align: bottom;
    margin-right: 5px;
}

input[type="radio"]{
    display: inline-block; 
    width: 22px; 
    height: 22px; 
    background:#fff; 
    vertical-align: bottom;
    margin-right:3px;
}


select {
cursor: pointer;
	width: 40%;
text-indent: 0.01px;
text-overflow: ellipsis;
border: 1px solid #ccc !important;
outline: none;
background: transparent;
background-image: none;
box-shadow: none;
height: 46px;
box-sizing: border-box;
font-size: 14px;
	border-radius:6px;
}

#contact-confirm .required{
    display: none !important; 
}



label{
    display: inline-block;
	margin-right: 20px;
	line-height: 1.5;
}

.btn-form{
	display: block;
	width: 500px;
	background: #d61518;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	border-radius: 40px;
	padding: 10px 0;
	text-align: center;
	border: 2px solid #d61518;
	margin: 0 auto;
}

.btn-form:hover{
	cursor: pointer;
	background: #fff;
	color: #d61518;
}


.privacy-check .mwform-checkbox-field-text{
	display: none !important;
}

button{
	border: none ;
	cursor: pointer;
	-webkit-appearance:none;
}

@media only screen and (max-width: 650px) {

input[type="text"], 
input[type="number"], 
input[type="email"], 
input[type="password"] , 
input[type="tel"] ,
input[type="date"] ,  
input[type="time"] ,     
input[type="search"]  {
	height: 42px;
}

textarea{
	min-height: 120px;
}

::placeholder{
	font-size: 13px;
}

    
.btn-form{
    -webkit-appearance:none;
    display: block;
    width: 100%;
    margin: 0 auto;
}

select {
width: 100%;
height: 42px;
} 
    


label{
    display: inline-block;
}    
    
	
}



/*==================================================
contact
================================================== */

#mainimg-contact img.img-mainimg-page{
	width: 620px;
}

#mainimg-contact .title-page{
	border-bottom:  1px solid #221714;
	padding-bottom: 12px;
	margin-bottom: 50px;
}

#mainimg-contact .mainimg-page-price{
	width: 70%;
	border-top: 1px solid #221714;
	padding-top: 30px;
	margin: 35px auto 0;
}

.mv-contact{
	border-bottom: none !important;
	padding-bottom: 0 !important;
}

.title-contact{
	display: block;
	border: 2px solid #221714;
	font-size: 32px;
	text-align: center;
	padding: 8px 0;
	border-radius: 40px;
	margin-bottom: 50px;
}

.required{
	display: inline-block;
	font-size: 12px;
	color: #fff;
	background: #d61518;
	border-radius: 20px;
	padding: 3px 12px;
	margin-left: 10px;
	line-height: 1;
}

.privacy-check{
	text-align: center;
	margin: 50px 0 35px;
	font-size: 16px;
}

.privacy-check > a{
	display: inline-block;
	margin-right: 30px;
}

.privacy-check > span{
	display: inline-block;
	margin-right: 10px;
}

.privacy-check > span > span{
	color: #d61518;
}

p.txt-form{
	color: #d61518;
	font-size: 13px;
	margin: 10px 0 0;
}

#contact-confirm p.txt-form,
#contact-confirm .privacy-check{
	display: none;
}

#contact-flow{
	padding: 120px 0;
}

#contact-flow h3{
	display: block;
	border-top: 1px solid #221714;
	border-bottom: 1px solid #221714;
	font-size: 32px;
	text-align: center;
	padding: 12px 0;
	margin-bottom: 50px;
}

.dl-basic dt{
	padding: 8px 15px;
	background: #eee;
}

.dl-basic dd{
	padding: 20px 15px 25px;
}

#contact-flow > p{
	text-align: center;
	margin: 50px 0;
	font-size: 20px;
}

#contact-flow > p > a{
	color: #000;
	text-decoration: underline;
}

#contact-confirm,
#contact-thanks,
#contact-error{
	padding-bottom: 80px;
}


@media only screen and (max-width: 650px) {
	
#mainimg-contact img.img-mainimg-page{
	width: 98%;
}

#mainimg-contact .title-page{
	margin-bottom: 30px;
}

#mainimg-contact .mainimg-page-price{
	width: 100%;
	padding-top: 30px;
	margin: 30px auto 0;
}

.title-contact{
	font-size: 20px;
	margin-bottom: 35px;
}

.required{
	font-size: 11px;
}

.privacy-check{
	margin: 30px 0 25px;
	font-size: 14px;
}

p.txt-form{
	font-size: 12px;
}

#contact-confirm p.txt-form{
	display: none;
}

#contact-flow{
	padding: 50px 0;
}

#contact-flow h3{
	font-size: 20px;
	padding: 10px 0;
	margin-bottom: 35px;
}


#contact-flow > p{
	margin: 35px 0;
	font-size: 15px;
}

.kibou-design span.mwform-checkbox-field{
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 6px 0 !important;
}
}

/*==================================================
menu-list
================================================== */
#menu-list{
	padding: 15px 0 100px;
}