@charset "utf-8";
/*Aztron　基本CSS---------------------------------------------------------*/

@import 'https://use.typekit.net/pav8ybm.css';

/* グローバルメニューのタグ */
nav li:nth-child(5) a {background: #3f4649; color: #FFF; text-decoration: underline;}

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

/**============================================================================================**/
input[type="text"],
input[type="tel"] { width: 50%; height: 34px;}
input[type="email"] { width: 80%; height: 34px;}
textarea {width: 100%;}

input[type="text"],
input[type="email"],
input[type="tel"],
select,
textarea {
	box-sizing: border-box; padding: 6px 12px;
	border: solid 1px #ccc; border-radius: 4px;
	color: #555; font-size: 16px; line-height: 1.428571429; vertical-align: middle;
	-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);
	-webkit-transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;
	transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;}

/* チェックボックス */
#contact .p_5 {background: #547d73; color: #fff;}

input[type="checkbox"],
input[type="radio"] { 
	position: absolute; top: 3px; left: 0; 
	width: 16px; height: 16px; margin: 0;}

#contact .checkbox-contact label,
#contact .hant-category label,
form#mailformpro label.mfp_checked,
form#mailformpro label.mfp_not_checked { 
	display: inline-block; position: relative;
	box-sizing: border-box; width: auto; margin: 0; padding: 0 0 0 21px;
	font-size: 16px; line-height: 1.5em; vertical-align: top;}

/* 送信ボタン */
.mfp_element_submit:hover { 
    background: light-dark(rgba(239, 239, 239, 0.3), rgba(19, 1, 1, 0.3));
    cursor: default;}

#mail_submit_button[disabled] { border-color: rgba(133,133,133,0.30); opacity: 1;}
#mail_submit_button[disabled]:hover { opacity: 1;}
#mail_submit_button { 
	padding: 10px 40px;
	border: solid 1px; border-radius: 4px;
    border-color: rgba(133,133,133,1.0);
    font-size: 14px;}
    
#mail_submit_button:hover { opacity: 0.7; cursor: pointer;}


@media screen and (max-width:699px){
input[type="text"] {font-size: 16px;}
input[type="email"] { width: 100%; font-size: 16px;}
textarea {font-size: 16px;}
}


/* 入力ステータス */
*[required],
input[type="text"].required,
input[type="email"].required,
.required{
  background: rgba(255, 221, 221, 0.7);
}

*[required].dealed,
.required.dealed{
  background: rgba(223, 240, 216, 1);
}

.caution{
  background: rgba(252, 248, 227, 1);
}

.alert{
  background: rgba(255, 221, 221, 0.7);
  margin-bottom: 0px;
}

.alphabet{
  ime-mode: disabled;
}

/*　必須項目用　*/
div.hissu .alrt {color:#f00; line-height:1.3em;}



/* ご購入頂いた製品にトラブルがあった場合・・・ */
main div.posi-rlt {
    max-width: 470px; margin: 30px auto;  padding: 0px 0px 0px 85px;
    font-size: 14px; font-weight: 600; line-height: 1.6em;}

main div.posi-rlt::before {
    content: url("./images/icon_handshake.png");
    position: absolute; top: 50%; left: 10px;
    margin: -25px 0 0;}
/*==========================================================================================================*/

/*==========================================================================================================*/
/* CONTACT */
#area03 section {margin: 0; padding: 20px 10px 50px;}
#area03 .m-b30 {font-size: 16px;}
#area03 strong {font-size: 40px; line-height: 1.0em;}

#area03 .dis-tbl_tab {width: 100%; margin: 0 0 20px;}
#area03 .dis-tblcl01 {width: 220px; font-weight: 600;}

#area03 input[type="text"] { width: 50%; height: 34px;}
#area03 select { width: 40%; height: 34px;}
#area03 input[type="text"].long { width: 100%; height: 34px;}
#area03 input[type="email"] { width: 50%; height: 34px;}
#area03 textarea {width: 100%;}

#area03 input[type="text"],
#area03 input[type="email"],
#area03 textarea {
	box-sizing: border-box; padding: 6px 12px;
	border: 1px solid #ccc; border-radius: 4px;
	color: #555; font-size: 14px; line-height: 1.428571429; vertical-align: middle;
	-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);
	-webkit-transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;
	transition: border-color ease-in-out 0.15s,box-shadow ease-in-out 0.15s;
}

#area03 input[type="submit"] {
	padding: 10px 40px;
	border: solid #FFF 1px; border-radius: 4px;
	background: linear-gradient(0deg, #0057bb, #00c7cc);
	color: #FFF; font-size: 14px; 
}
@media screen and (min-width:0px) and (max-width:699px){
#area03 section {padding: 30px 10px;}
#area03 strong {font-size: 28px;}

#area03 .dis-tbl_tab,
#area03 .dis-tblcl01,
#area03 .dis-tblcl02 {display: block; width: 100%;}

#area03 .dis-tblcl02 { margin-top: 10px;}

#area03 input[type="text"] {font-size: 16px;}
#area03 input[type="email"] { width: 100%; font-size: 16px;}
#area03 textarea {font-size: 16px;}
}

#area03 .tel {
	max-width: 320px; margin: 30px auto 0; padding: 20px 0; border: solid #005be5 3px; 
	color: #005be5; font-size: 16px; line-height: 3.0em
	}
#area03 .tel a {padding: 0 0 0 40px; color: #005be5; font-size: 36px; text-decoration: none; letter-spacing: -0.05em;}
#area03 .tel a:before {position: absolute; top: -1px; left: 0; content: url(./images/icon-tel.png);}


/* 入力ステータス */
*[required],
input[type="text"].required,
input[type="email"].required,
.required{
  background-color: rgba(255, 221, 221, 0.7);
}

*[required].dealed,
.required.dealed{
  background-color: rgba(223, 240, 216, 1);
}

.caution{
  background-color: rgba(252, 248, 227, 1);
}

.alert{
  background-color: rgba(255, 221, 221, 0.7);
  margin-bottom: 0px;
}

div.required{
  padding: 0px 15px 5px 15px;
  /*margin-left: 15px;*/
}

.alphabet{
  ime-mode: disabled;
}

#email_confirm,#email_confirm2{
  font-size: 230%;
  font-family: monospace;
}

#cc_number{
  background-image: none;
  background-position: 97% 50%;
  background-repeat: no-repeat;
}

#cc_holder{
  text-transform: uppercase;
}



.ui-widget-content{
  border-color: #ccc;
}

.ui-widget-content td.ui-datepicker-today span{
  background: rgba(255, 165, 0, 0.4) none;
}

/*追加分****************/
.reqmk{background-color:#ffffff; border:#C74A4C solid 1px; color:#C74A4C; display:inline-block; padding:2px; font-weight:bold; margin:0 0 0 10px; box-sizing:border-box;}/*必須マーク*/

/*　必須項目用　*/
div.hissu .alrt {color:#f00; line-height:1.3em;}

@media (max-width: 767px){
  .continue,
  .datepicker{
    margin-bottom: 4px;	
  }
  }


/* 電話でのお問合せ */

#area03 div.posi-rlt {
    max-width: 470px; margin: 30px auto 30px;  padding: 0px 0px 0px 85px;
    font-size: 14px; font-weight: 400; line-height: 1.6em;}

@media screen and (max-width:599px){
#area03 div.posi-rlt span.dis-blk { display: inline;}

}



#area03 div.posi-rlt:before {
    content: url("./images/icon_handshake.png");
    position: absolute; top: 50%; left: 10px;
    margin: -25px 0 0;
}

#area03 div.posi-rlt a { position: relative; padding: 0 0 0 16px; color: #428bca;}
#area03 div.posi-rlt a:hover {color: #2a6496;}

#area03 div.posi-rlt a:before {
    content: '';
    display: inline-block; position: absolute; top: 6px; left: 0;
    width: 7px; height: 7px;
    border: solid #428bca; border-width: 2px 2px 0 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;    
}

#area03 div.posi-rlt a:hover:before { border-color: #2a6496;}

#area03 .re-captcha { width: 304px; margin: 0 auto;}



/* reCAPTCHA v3　表示位置 */
.grecaptcha-badge { display: block;}


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

/**============================================================================================**/
/* HANT アウトドアバッグ テスター募集 */
#surfboard { max-width: 800px; margin: 0 auto;}

#surfboard .bg { margin: 0 0 50px; background: #333;}

#surfboard .bg a { 
    display: block; position: relative;
    width: 200px; margin: 0 auto 10px; padding: 10px 20px 10px 10px; 
    border-radius: 6px;
    background: #3dbbb8;
    color: #fff; font-size: 18px; font-weight: bold; text-align: center;}

#surfboard .bg a::before {
    content: '';
    display: inline-block; position: absolute; top: 50%; right: 15px;
    width: 10px; height: 10px; margin: -5px 0 0;
    border: solid #fff; border-width: 0 3px 3px 0;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);}
    

#surfboard h2 ~ ul { max-width: 610px; margin: 0 auto; padding: 10px;}
#surfboard h2 ~ ul li { 
    margin: 10px 0 10px 1em; 
    color: #fff; font-weight: 600; text-indent: -1em;}

#surfboard h3 { 
    margin: 50PX 0 30px; padding: 0 0 5px; 
    border-bottom: solid 1px #000; 
    font-size: 20px; line-height: 1.0em;}

#surfboard .dis-tbl_tab {width: 100%; margin: 0 auto 30px;}
#surfboard .dis-tbl_tab > * { display: table-cell; vertical-align: top;}
#surfboard .dis-tbl_tab > p {width: 250px; font-weight: 600;}

/* メールアドレス・InstagramアカウントID */
#surfboard input[type="email"],
#surfboard input[name="InstagramアカウントID"] { width: 100%;}

#surfboard input[type="email"] ~ p  { font-size: 13px;}


/* 年齢（任意） */
#surfboard input[name="年齢"] { display: inline-block; width: 80px;}

/* その他の詳細 */
#surfboard input[name="その他の詳細"] { width: 100%; background: rgba(255, 221, 221, 0.7);}
#surfboard input[name="その他の詳細"][disabled] { display: none;}

/* 同意確認 */
#surfboard .check { margin: 0 0 30px;}
#surfboard .check li { margin: 0 0 20px; font-weight: bold;}

#surfboard form#mailformpro label { white-space: normal;}

/* cssのリセット（label） */
form#mailformpro .genre label.mfp_checked,
form#mailformpro .genre label.mfp_not_checked,
form#mailformpro .frequency label.mfp_checked,
form#mailformpro .frequency label.mfp_not_checked { width: 120px; margin: 0 10px 15px 0;}


@media screen and (max-width:699px){
    #surfboard .dis-tbl_tab,
    #surfboard .dis-tbl_tab > * {display: block;}

    #surfboard .dis-tbl_tab > p { width: auto; margin: 0 0 10px;}
    #surfboard .dis-tbl_tab > p br { display: none;}
}


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

/**============================================================================================**/
/* 問い合わせ送信完了 */
#completion {padding: 50px 15px;}
#completion section {max-width: 600px; margin: 0 auto; padding: 30px 0;}


/* メッセージを送信しました */
#completion .dis-tbl_tab {margin: 0 0 30px; padding: 0 0 30px; border-bottom: dotted 1px #333;}
#completion .dis-tbl_tab > * { display: table-cell; vertical-align: middle;}
#completion .dis-tbl_tab p {padding: 0 0 0 30px; font-size: 1.1em; font-weight: 600;}

@media screen and (max-width:699px){
	#completion .dis-tbl_tab,
	#completion .dis-tbl_tab > * {display: block;}
	
	#completion .dis-tbl_tab p {padding: 10px 0 0;}
}


/* ご確認お願いします */
#completion .posi-rlt {margin: 0 0 10px; padding: 0 0 0 25px; font-weight: 600;}
#completion .posi-rlt::before {
	content: ''; display: inline-block;
	position: absolute; top: 2px; left: 0;
	width: 22px; height: 17px;
	background: url(./images/icon-chuui.gif);}

#completion .fs_08 {line-height: 1.8em;}

#completion .m-t30 {padding: 30px 0 0; border-top: dotted 1px #333;}

/* LastUp2026.01.30_kimata */