@charset "utf-8";
main { 
    max-width: 1200px; margin: 0 auto; padding: 0 15px;
    font-size: 14px; line-height: 1.8em;}

section:not(#pankuzu) { max-width: 800px; margin: 0 auto 50px;}

h2 {
    margin: 0 0 20px; padding: 0 0 5px;
    border-bottom: solid 2px #960002;
    font-size: 1.4em; line-height: 1.3em;}

h3 { font-size: 1.2em; margin: 0 0 10px;}

video {width: 100%; height: auto;}
/**========================================**/
/* パンクズリスト */
#pankuzu {
    box-sizing: border-box; margin: 20px 0; padding: 3px 0; 
    font-size: 12px; line-height: 1.3em;}

#pankuzu a {color: #535353; text-decoration: none;}
#pankuzu a:hover {color:#f50; text-decoration: underline;}
    
@media screen and (max-width:1024px) {
#pankuzu {
	position: static; top: auto; left:auto;
	margin:20px 0;}

}
    
@media screen and (max-width:699px) {
#pankuzu {
	overflow-x: scroll; white-space: nowrap;
	margin:20px 0 10px; padding:3px; background: #D8D8D8;}
	
#pankuzu div {display: inline-block; padding: 5px;}

/* スクロールバーの装飾 */
#pankuzu::-webkit-scrollbar {height: 8px;}
#pankuzu::-webkit-scrollbar-track {background-color: rgba(235, 235, 235, 1.0);}
#pankuzu::-webkit-scrollbar-thumb {background-color: rgba( 150, 150, 150, 0.8);}

}

/**============================================================================================**/

/**============================================================================================**/
/* クレーム申請 */
#complain01 img { max-width: none;}
#complain01 table { width: 100%; margin: 0 auto 10px; border-color: #888; border-collapse: collapse;}

#complain01 table th { padding: 10px; background: #333; color: #fff;}
#complain01 table th:nth-of-type(2) { text-align: left;}

#complain01 table td { padding: 10px;}
#complain01 table td:nth-of-type(1) { padding: 15px 10px; text-align: center;}
#complain01 table td:nth-of-type(1) p { margin: 5px 0 0; font-size: 13px; color: #666;}

#complain01 .dis-tbl_tab { width: 100%;}
#complain01 .dis-tbl_tab p { display: table-cell; vertical-align: middle;}
#complain01 .dis-tbl_tab p:nth-of-type(2) { width: 160px; font-size: 15px; font-weight: bold; vertical-align: middle;}

#complain01 ul { list-style: disc; padding: 0 0 0 30px;}
#complain01 li { margin: 0 0 15px;}
#complain01 li strong { color: #0d4292; font-size: 15px; line-height: 1.8em;}

@media screen and (max-width:699px){
#complain01 table th,
#complain01 table td { padding:5px;}
#complain01 table td:nth-of-type(1) { padding: 10px 5px;}

#complain01 .dis-tbl_tab,
#complain01 .dis-tbl_tab p { display: block;}
}

@media screen and (max-width:699px){
#complain01 .scroll { overflow-x: scroll;}
#complain01 table { width: 700px;}

}


/**============================================================================================**/

/**============================================================================================**/
/* クレーム申請フォーム */
#complain02 .dis-tbl_tab { width: 100%; margin: 0 0 30px;}
#complain02 .dis-tblcl01,
#complain02 .dis-tblcl02 { 
    box-sizing: border-box; width: 200px; padding: 8px 15px 0 0; 
    font-weight: bold; line-height: 1.3em; vertical-align: top;}
    
#complain02 .dis-tblcl01 { position: relative; padding: 8px 55px 0 0;}

/*必須マーク*/
.reqmk {
    display:inline-block; position: absolute; top: 4px; right: 15px;
    padding:2px; 
    border:solid #C74A4C 1px; background:#fff; 
    color:#C74A4C; font-weight:bold;}
    
@media screen and (max-width:699px){
#complain02 .dis-tbl_tab,
#complain02 .dis-tblcl { display: block;}

#complain02 .dis-tblcl01,
#complain02 .dis-tblcl02 { display:inline-block;}

#complain02 .dis-tblcl01 { width: auto; padding: 0 45px 5px 0;}
#complain02 .dis-tblcl02 { padding: 0 0 5px;}

.reqmk { top: -4px; right: 0;}
}

/**========================================**/

#complain02 .dis-tblcl .dis-ilblk { margin: 0 10px 0 0;}


#complain02 ul.dis-tblcl li {margin: 15px 0 0;}
#complain02 ul.dis-tblcl li:nth-of-type(1) { margin: 0;}
#complain02 ul.dis-tblcl li p:nth-of-type(1) { margin: 0 0 5px;}

#complain02 ul.dis-tblcl input[type="text"] { max-width: none;}

@media screen and (max-width:599px){
#complain02 ul.dis-tblcl li,
#complain02 ul.dis-tblcl li p { display: block;}
#complain02 ul.dis-tblcl li:nth-of-type(1) { margin: 0 0 5px;}

#complain02 ul.dis-tblcl li p:nth-of-type(1) { text-align: left;}
}

/* アスタリスク */
#complain02 p.asterisk {position: relative; padding: 0 0 0 18px;}
#complain02 p.asterisk::before {content:'※'; position: absolute; top: 0; left: 0;}

/* シリアル番号の場所はこちら */
#complain02 .frame { display: inline-block; margin: 0 0 15px; padding: 5px 8px; border: solid 1px #C74A4C;}
#complain02 .frame strong { color: #A80000;}
/**============================================================================================**/
#complain02 .dis-tblcl input[type="radio"] { display: none;}
#complain02 .dis-tblcl label { display: inline-block; position: relative; margin: 8px 0; padding: 0 0 0 24px;}

#complain02 .dis-tblcl label::before,
#complain02 .dis-tblcl label::after {
    content: '';
    display: block; position: absolute;
    border-radius: 50%;}

#complain02 .dis-tblcl label::before {
    top: 3px; left: 0;
    box-sizing: border-box; width: 16px; height: 16px; border: solid 1px #ccc;}

#complain02 .dis-tblcl label::after { 
    top: 6px; left: 3px;
    width: 10px; height: 10px; background: #fff;}


#radio01:checked ~ label::before,
#radio02:checked + label::before,
#radio03:checked ~ label::before,
#radio04:checked + label::before,
#radio05:checked + label::before,
#radio06:checked + label::before,
#radio07:checked + label::before,
#radio08:checked ~ label::before,
#radio09:checked + label::before,
#radio10:checked + label::before { border-color: #0000FF;}
#radio01:checked ~ label::after,
#radio02:checked + label::after,
#radio03:checked ~ label::after,
#radio04:checked + label::after,
#radio05:checked + label::after,
#radio06:checked + label::after,
#radio07:checked + label::after,
#radio08:checked ~ label::after,
#radio09:checked + label::after,
#radio10:checked + label::after { background: #0000FF;}


/* アコーディオン 表示・非表示エリア */
.accordion01 {
  overflow-y: hidden;
  max-height: 0; margin: 0; padding:0; border:none; opacity: 0;
  -webkit-transition: max-height 0.5s;
  -moz-transition: max-height 0.5s;
  -ms-transition: max-height 0.5s;
  -o-transition: max-height 0.5s;
  transition: max-height 0.5s;
}

/* アコーディオンをクリックした場合 */
#radio07:checked ~ .accordion01 { max-height: 110px;  opacity: 1;}



/**========================================**/


main input,
main textarea { box-sizing: border-box; font-size: 16px;}

main input[type="text"],
main input[type="tel"] { width: 100%; max-width: 300px;}

main #radio10_tx { max-width: 65px;}    /* 使用回数 */

main input[type="email"],
main textarea { width: 100%;}

#mail_submit_button { 
    width: 200px; height: 48px; 
    font-size: 21px; font-weight: bold; letter-spacing: 0.2em;}




::placeholder { font-size: 14px; line-height: 1.8em;}



/**========================================**/
.mfp_element_text,
.mfp_element_number,
.mfp_element_select-one,
.mfp_element_email,
.mfp_element_tel,
.mfp_element_textarea,
.mfp_element_date,
.mfp_element_password { 
    padding: 6px;
    border: solid #ccc 1px; border-radius:4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);}
    
    
.mfp_element_file {
    margin: 0 15px 0 0;
}

button.mfp_attached_reset {
    margin: 15px 0 0;
}    
    
    
/* 必須未記入時のエラー*/
.formErrorContent {
    display: inline-block;
    margin: 0;
    padding: 4px 6px;
    background: #ee0101;
    color: #fff;
    font-size: 11px;
    line-height: 1.0em;
}
/**========================================**/

/* アコーディオン 開閉ボタン
form#mailformpro label[for="menu_bar01"] {
    display: inline-block; position: relative; 
    margin: 0 auto; padding: 0 45px 0 0;
    font-size: 18px; font-weight: bold; text-decoration: underline; 
    cursor: pointer; transition: all 0.4s;}
    
form#mailformpro label[for="menu_bar01"]:hover {color:#f50;}

label[for="menu_bar01"]::after {
    content: '';
    display: inline-block; position: absolute; top: 50%; right: 15px;
    width: 10px; height: 10px; margin: -11px 0 0;
    border: solid #960002; border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);}
 */
 
/* アコーディオン 表示・非表示エリア 
.area1 {
  overflow-y: hidden;
  max-height: 0;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
*/

/* アコーディオンをクリックした場合
#menu_bar01:checked ~ .area1 {max-height: 1000px; }
#menu_bar01:checked ~ label[for="menu_bar01"]:after {
    content: '×';
    top: 50%; right: 10px;
    width:auto; height:auto; margin: -14px 0 0; border:none; 
    color: #1fc08e; font-size: 26px; font-weight: 600;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);}
 */    
/**========================================**/    
/* 動画の撮り方 
.area1 .posi-rlt { height: 0; padding: 470px 0 0;} 

.area1 > .m-t15 { background: #f2f2f2;} 

@media screen and (max-width:829px) and (min-width:700px){
.area1 .posi-rlt { padding: 89% 0 0;} 
}

@media screen and (max-width:699px){
.area1 .posi-rlt { padding: 76% 0 0;} 
}

@media screen and (max-width:599px){
.area1 .posi-rlt { padding: 90% 0 0;} 
}

@media screen and (max-width:399px){
.area1 .posi-rlt { padding: 94% 0 0;} 
}

.area1 img { max-width: 100%; height: auto;}    
*/
/**========================================**/
/* 説明画像表示エリア
.area1 .posi-abs { 
    top: 0 ; left: 0; z-index: 1;
    box-sizing: border-box; width: 100%; padding: 0 40px;
    opacity: 1;
    -webkit-transition: opacity 0.5s;
    -moz-transition: opacity 0.5s;
    -ms-transition: opacity 0.5s;
    -o-transition: opacity 0.5s;
    transition: opacity 0.5s;}

.area1 .posi-abs p {
    margin: 10px 0 0;
    color: #960002; font-size: 21px;}

@media screen and (max-width:829px) and (min-width:700px){
.area1 .posi-abs { padding: 0;}
}

@media screen and (max-width:599px){
.area1 .posi-abs { padding: 0;}
}
 */
 
/* 画像表示エリアのフェードイン・フェードアウト
#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt #fade2,
#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt #fade3,
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt #fade1,
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt #fade3,
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt #fade1,
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt #fade2 { opacity: 0;}
 */
/* 次へ・前へボタン
form#mailformpro .area1 .m-t15 .posi-rlt > label { 
    display: none; position: absolute; top: 160px; z-index: 2;
    box-sizing: border-box; width: 30px; height: 60px; margin: 0;
    background: #666; cursor: pointer;}

form#mailformpro .area1 .m-t15 .posi-rlt > label:hover { background: #000;}

form#mailformpro .area1 .m-t15 .posi-rlt > label::before {
    content: '';
    display: none; position: absolute; top: 50%; z-index: 3;
    width: 18px; height: 18px; margin: -10px 0 0;
    border: solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);}

@media screen and (max-width:829px) and (min-width:700px){
form#mailformpro .area1 .m-t15 .posi-rlt > label { top: 42%; margin: -30px 0 0; background: #999;}
}

@media screen and (max-width:599px){
form#mailformpro .area1 .m-t15 .posi-rlt > label { top: 42%; margin: -30px 0 0; background: #999;}
}

#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"],
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img1"],
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img3"],
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"] { display: block;}

#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"],
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img3"] { right: 0;}
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img1"],
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"] { left: 0;}


#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"]::before,
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img1"]::before,
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img3"]::before,
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"]::before { display: inline-block; }

#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"]::before,
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img3"]::before { left: 0; border-width: 4px 4px 0 0 ;}

#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img1"]::before,
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"]::before { right: 0; border-width: 0 0 4px 4px;}

@media screen and (max-width:829px) and (min-width:700px){
#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"],
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img3"] { right: 5px;}
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img1"],
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"] { left: 5px;}
}

@media screen and (max-width:599px){
#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"],
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img3"] { right: 5px;}
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img1"],
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .posi-rlt > label[for="movie-img2"] { left: 5px;}
}
 */
/* dotナビゲーション
form#mailformpro .dot-nav { font-size: 0; text-align: center;}
    
form#mailformpro .dot-nav label { 
    content: '';
    display: inline-block;
    width: 12px; height: 12px; margin: 0 8px 5px;
    border-radius: 50%; background: #999;
    vertical-align: bottom;}


#movie-img1:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .dot-nav label[for="movie-img1"],
#movie-img2:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .dot-nav label[for="movie-img2"],
#movie-img3:checked ~ form .dis-tbl_tab .dis-tblcl .area1 .m-t15 .dot-nav label[for="movie-img3"] { background: #333;}
 */
/**============================================================================================**/

/* LastUp2026.07.17_kimata */