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


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

area-tit

==================================================*/
.area-tit{
	margin-bottom: 0;
}
@media (max-width: 750px) {
	.area-tit{
	   margin-bottom: 0;
	}
}

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

cmn-area

==================================================*/
.cmn-area .box-txt{
	margin-bottom: 4em;
}
.cmn-area .box-mid{
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 0.5em;
}
@media (max-width: 750px) {
	.cmn-area .box-txt{
		margin-bottom: 2em;
	}
	.cmn-area .box-mid{
		font-size: 1.4rem;
		font-weight: bold;
		margin-bottom: 0.5em;
	}
	.cmn-area.area-tit{
		margin-bottom: 2em;
	}
}
/*==================================================

wrap-attention

==================================================*/
.wrap-attention{
	margin-bottom: 8em;
}
.wrap-attention > .wrap-txt{
	border: 1px solid #A5A5A6;
	padding: 40px;
}
@media (max-width: 750px) {
	.wrap-attention{
		margin-bottom: 4em;
	}
	.wrap-attention > .wrap-txt{
		padding: 20px;
	}
}
/*====================================
list-circle
====================================*/
.wrap-attention .list-circle{
	display: block;
}
.wrap-attention .list-circle > li{
	position: relative;
	padding-left: 10px;
	display: block;
}
.wrap-attention .list-circle > li::before{
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 0.5em;
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	background: #000000;
	border-radius: 50%;
}
.wrap-attention .list-circle > li + li{
	margin-top: 1em;
}
.wrap-attention .box-txt + .list-num .box-txt + .list-circle{
	margin-top: 0.5em;
}
@media (max-width: 750px) {
	.wrap-attention .list-circle > li{
		font-size: 1.2rem;
	}
}
/*====================================
link
====================================*/
.wrap-attention .list-circle a{
	display: table;
}

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

form

==================================================*/
input,
textarea,
select{
	padding: 0.5em;
}
textarea,
select{
	border: 1px solid #DDD;
}
select{
	min-width: 12em;
}
textarea{
	height: 6em;
}
textarea,
input[type="text"],
input[type="email"]{
	width: 100%;
}
input:focus::-webkit-input-placeholder,
input:focus::-moz-placeholder,
input:focus::-ms-input-placeholder,
input:focus::placeholder {
	color: transparent;
}



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

box-radio

==================================================*/
.box-radio .wpcf7-list-item{
	margin: 0 1em 0 0;
}
.box-radio{
	display: inline-block;
	position: relative;
}
.box-radio input[type="radio"] {
    display: none;
}
.box-radio input[type="radio"] + .wpcf7-list-item-label{
	cursor: pointer;
	display: inline-block;
	position: relative;
	padding-left: 15px;
}
.box-radio input[type="radio"] + .wpcf7-list-item-label::before,
.box-radio input[type="radio"] + .wpcf7-list-item-label::after{
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.box-radio input[type="radio"] + .wpcf7-list-item-label::before{
	border: 1px solid #A5A5A6;
}
.box-radio input[type="radio"] + .wpcf7-list-item-label::after{
	opacity: 0;
	width: 8px;
	height: 8px;
	background: #e60012;
	margin-left: 2px;
}
.box-radio input[type="radio"]:checked + .wpcf7-list-item-label::after{
	opacity: 1;
}

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

box-checkbox

==================================================*/
.box-checkbox .wpcf7-list-item{
	margin: 0 1em 0 0;
}
.box-checkbox{
	display: inline-block;
	position: relative;
}
.box-checkbox input[type="checkbox"] {
    display: none;
}
.box-checkbox input[type="checkbox"] + .wpcf7-list-item-label{
	cursor: pointer;
	display: inline-block;
	position: relative;
	padding-left: 15px;
}
.box-checkbox input[type="checkbox"] + .wpcf7-list-item-label::before,
.box-checkbox input[type="checkbox"] + .wpcf7-list-item-label::after{
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.box-checkbox input[type="checkbox"] + .wpcf7-list-item-label::before{
	border: 1px solid #A5A5A6;
}
.box-checkbox input[type="checkbox"] + .wpcf7-list-item-label::after{
	opacity: 0;
	width: 8px;
	height: 8px;
	background: #e60012;
	margin-left: 2px;
}
.box-checkbox input[type="checkbox"]:checked + .wpcf7-list-item-label::after{
	opacity: 1;
}









.js-ajaxzip3{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 20px;
	background: #dcdddd;
	border-radius: 5px;
	cursor: pointer;
}
.js-ajaxzip3:hover{
	opacity: .5;
}
/*==================================================

wrap-table

==================================================*/
.wrap-table{
	border-bottom: 1px solid #A5A5A6;
}
.wrap-table + .wrap-table{
	margin-top: 4em;
}
.wrap-table > .list-box{
	display: flex;
	align-items:flex-start;
	border-top: 1px solid #A5A5A6;
}
.wrap-table > .list-box > li.box-th{
	display: flex;
	justify-content: space-between;
	font-size: 1.4rem;
	padding: 1em 0;
	width: 6em;
	color: #5A5A5A;
	margin-right: 20px;
	font-weight: bold;
}
.wrap-table > .list-box > li.box-td{
	font-size: 1.4rem;
	padding: 1em 0px;
	width: calc( 100% - 6em - 20px );
	line-height: 200%;
}
.wrap-verification .wrap-table > .list-box{
	align-items: stretch;
}
.wrap-verification .wrap-table > .list-box > li.box-th{
	width: 12em;
	background: #DEDEDE;
	padding-left: 1em;
}

/*====================================
area-tel
====================================*/
@media (min-width: 751px) {
	.area-tel .wrap-table > .list-box > li.box-th{ width: 6em; }
	.area-tel .wrap-table > .list-box > li.box-td{ width: calc( 100% - 6em - 20px ); }
}
/*====================================
area-mail
====================================*/
@media (min-width: 751px) {
	.area-mail .wrap-table > .list-box > li.box-th{ width: 20em; }
	.area-mail .wrap-table > .list-box > li.box-td{ width: calc( 100% - 20em - 20px ); }
}

@media (max-width: 750px) {
	.wrap-table + .wrap-table{
		margin-top: 2em;
	}
	#wrapper:not(.js-mode_verification) #js-form .wrap-table > .list-box{
		display: block;
		border-top: 1px solid #A5A5A6;
		align-items: center;
	}
	.wrap-table > .list-box > li.box-th{
		font-size: 1.0rem;
		padding: 20px 10px;
		width: 6em;
		margin-right: 20px;
	}
	#wrapper:not(.js-mode_verification) #js-form .wrap-table > .list-box > li.box-th{
		font-size: 1.4rem;
		padding: 20px 0 0;
		width: 100%;
		margin-right: 0;
	}
	.wrap-table > .list-box > li.box-td{
		font-size: 1.0rem;
		padding: 20px 0px;
		width: calc( 100% - 6em - 20px );
	}
	#wrapper:not(.js-mode_verification) #js-form .wrap-table > .list-box > li.box-td{
		padding: 10px 0px 20px;
		width: 100%;
	}
}
/*==================================================

wrap-table td

==================================================*/
#wrapper:not(.js-mode_verification) #js-form .wrap-table > .box-mid{
	margin-bottom: 0;
    background: #dcdddd;
    padding: 10px 20px;
}
/*====================================
box-td input-one
====================================*/
.wrap-table > .list-box > li.box-td.input-one .wpcf7-form-control-wrap{
	display: inline-block;
	width: 100%;
}
.wrap-table > .list-box > li.box-td.input-one .wpcf7-form-control-wrap:not(:first-of-type){
	margin-top: 0.5em;
}
/*====================================
box-td input-two
====================================*/
.wrap-table > .list-box > li.box-td.input-two{
	display: flex;
	justify-content: flex-start;
}
.wrap-table > .list-box > li.box-td.input-two .wpcf7-form-control-wrap{
	display: inline-block;
	width: calc( ( 100% - 20px ) / 2);
}
.wrap-table > .list-box > li.box-td.input-two .wpcf7-form-control-wrap:first-of-type{
	margin-right: 20px;
}
@media (max-width: 750px) {
	.wrap-table > .list-box > li.box-td.input-two .wpcf7-form-control-wrap{
		width: calc( ( 100% - 10px ) / 2);
	}
	.wrap-table > .list-box > li.box-td.input-two .wpcf7-form-control-wrap:first-of-type{
		margin-right: 10px;
	}
}
/*====================================
box-td box-att
====================================*/
.wrap-table > .list-box > li.box-td .box-att{
	font-size: 1.2rem;
	color: #e60012;
	margin-top: 0.5em;
	padding-left: 1em;
	text-indent: -1em;
	line-height: 140%;
}
.box-submit{
	text-align: center;
	margin: 4em auto 0;
	position: relative;
	display: table;
}
.wpcf7 .box-submit .ajax-loader{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	margin: 0;
}
.box-submit input{
	cursor: pointer;
	padding: 10px 20px;
	color: #FFFFFF;
	background: #e60012;
	border: none;
	border-radius: 5px;
}
.box-submit input + input{
	margin-left: 1em;
}
.box-submit input:hover{
	opacity: 0.5;
}

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

wrap-table th

==================================================*/
/*====================================
box-th box-icon
====================================*/
.wrap-table > .list-box > li.box-th.icon-any,
.wrap-table > .list-box > li.box-th.icon-need{
	position: relative;
}
.wrap-table > .list-box > li.box-th.icon-any::after,
.wrap-table > .list-box > li.box-th.icon-need::after{
	content: "必須";
	position: absolute;
	margin-top: 1em;
	top:0;
	right: 0;
	display: block;
	font-size: 1.2rem;
	background: #e60012;
	color: #FFFFFF;
	padding: 5px 10px;
}
.wrap-table > .list-box > li.box-th.icon-any::after{
	content: "任意";
	background: #118FCE;
}
@media (max-width: 750px) {
	#wrapper:not(.js-mode_verification) #js-form .wrap-table > .list-box > li.box-th.icon-any,
	#wrapper:not(.js-mode_verification) #js-form .wrap-table > .list-box > li.box-th.icon-need{
		display: inline-block;
		width: auto;
		padding-right:3.5em;
	}
	#wrapper:not(.js-mode_verification) #js-form .wrap-table > .list-box > li.box-th.icon-any::after,
	#wrapper:not(.js-mode_verification) #js-form .wrap-table > .list-box > li.box-th.icon-need::after{
		font-size: 1.0rem;
		top:50%;
		transform: translateY(-50%);
		padding: 3px 10px;
		line-height: 100%;
	}
}

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

ie-att

==================================================*/
.ie-att{
	margin-top: 20px;
	text-align: center;
	font-size: 1.4rem;
	color: #e60012;
}

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

contact form

==================================================*/
/*
.wpcf7-not-valid-tip,
.wpcf7 form .wpcf7-response-output{ display: none; }
*/
.wpcf7-not-valid-tip{
	display: table;
	margin-top: 5px;
	color: #FFF;
	background: #FF0000;
	white-space: nowrap;
	padding: 0 10px;
	position: relative;
}
.wpcf7-not-valid-tip::before{
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #FF0000 transparent;
	top: 0;
	left: 20px;
	transform: translateY(-100%);
}
/*
input:focus + .wpcf7-not-valid-tip,
select:focus + .wpcf7-not-valid-tip{
	display: none;
}
*/



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

area-attention

==================================================*/
.area-attention .wrap-attention .list-circle > li.box-red{
    color: #e60012;
}
.area-attention .wrap-attention .list-circle > li.box-red::before{
    background: #e60012;
}
.area-attention .box-underline{
    text-decoration: underline;
}
.area-attention a.box-underline:hover{
    text-decoration: none;
}
/*==================================================

area-tab

==================================================*/
.area-tab{
    margin-bottom: 40px;
}
#js-tab{
    width: 100%;
    border-bottom: 2px solid #e60012;
    display: flex;
    justify-content: space-between;
}
#js-tab li{
    width: calc( 100% / 2 - 10px );
    text-align: center;
    padding: 10px;
    color: rgba(255,255,255,1.00);
    background: #a5a5a5;
    font-size: 2.4rem;
    cursor: pointer;
    letter-spacing: 0.1em;
    transition: color .3s;
}
@media (max-width: 750px) {
    #js-tab li{
        font-size:1.4rem;
    }
}
#js-tab li:hover{
    color: rgba(255,255,255,0.5);
}
#js-tab li.js-tab_active{
    background: #e60012;
}
.area-mail:not(.js-tab_active),
.area-tel:not(.js-tab_active){
    display: none;
}


.list-verification{
	margin: 4em auto 0;
    display: flex;
    justify-content: center;
}
.list-verification .box-btn{
	cursor: pointer;
	padding: 10px 20px;
	color: #FFFFFF;
	background: #e60012;
	border: none;
	border-radius: 5px;
    margin: 0 0.5em;
    display: inline-block;
}
.list-verification .box-btn:hover{
    opacity: 0.5;
}
.list-verification .box-submit{
	text-align: center;
    margin: 0 0.5em;
	position: relative;
	display: inline-block;
}
.list-verification .box-submit input{
    height: 100%;
}
.list-verification .box-submit input[type="submit"]{
    appearance: none;
    -webkit-appearance: none;
}
.list-verification .box-submit .wpcf7-spinner{
    position: absolute;
}


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

js-mode_verification

==================================================*/
#wrapper.wrapper-contact .wpcf7-not-valid-tip {
	display: none;
}

#wrapper .u-verification{
    display: none;
}
#wrapper.js-mode_verification .u-verification{
    display: inline;
}
#wrapper.js-mode_verification .u-input{
    display: none;
}

.js-mode_verification #js-form .wrap-table > .box-mid{
    background: none;
    padding: 0;
    margin-bottom: 0.5em;
}
@media (max-width: 750px) {
    .js-mode_verification #js-form .wrap-table > .list-box{
        display: flex;
    }
}

/* フォームのラベルを非表示 */
.js-mode_verification .wrap-verification .wpcf7-form-control-label {
    display: none;
}

/* フォームの入力項目をテキストに変更 */
.js-mode_verification .wrap-verification input[type="text"],
.js-mode_verification .wrap-verification input[type="email"],
.js-mode_verification .wrap-verification textarea {
    border: none;
    background-color: transparent;
    color: inherit;
    padding:0;
}
.js-mode_verification .wrap-verification input[type="text"],
.js-mode_verification .wrap-verification input[type="email"]{
    pointer-events: none;
}
.js-mode_verification .wrap-verification input[type="text"]:focus,
.js-mode_verification .wrap-verification input[type="email"]:focus,
.js-mode_verification .wrap-verification textarea:focus {
  pointer-events: auto;
}

.js-mode_verification .wrap-verification textarea {
    height: auto;
    resize: none;
}

/* selectボックスの選択項目のテキスト */
.js-mode_verification .wrap-verification select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: transparent;
    outline: none;
    pointer-events: none;
    padding: 0;
}
@media (max-width: 750px) {
    .js-mode_verification .wrap-verification select {
        max-width: 100%;
        width: 100%;
        overflow: hidden;
    }
}
.js-mode_verification .wrap-verification select:focus {
    pointer-events: auto;
}
.js-mode_verification .wrap-verification select option:checked {
    display: none;
}

/* radioボタンの選択項目のテキスト */
.js-mode_verification .wrap-verification input[type="radio"] + span{
    padding: 0;
}
.js-mode_verification .wrap-verification .box-radio .wpcf7-list-item{
    margin:0;
}
.js-mode_verification .wrap-verification input[type="radio"] + span:before,
.js-mode_verification .wrap-verification input[type="radio"] + span:after,
.js-mode_verification .wrap-verification input[type="radio"]:not(:checked) + span,
.js-mode_verification .wrap-verification input[type="radio"]:not(:checked) + span + label {
  display: none;
}

/* 各要素の非表示化 */
.js-mode_verification .wrap-verification .wrap-table > .list-box > li.box-th.icon-any::after,
.js-mode_verification .wrap-verification .wrap-table > .list-box > li.box-th.icon-need::after,
.js-mode_verification .wrap-verification .wrap-table > .list-box > li.box-td .box-att,
.js-mode_verification .wrap-verification .js-ajaxzip3,
.js-mode_verification .wrap-verification .wrap-table > .list-box > li.box-td.input-one .wpcf7-form-control-wrap[data-name="email_addr_confirm"]{
  display: none;
}

.js-mode_verification .wrap-verification .wrap-table > .list-box > li.box-td.input-two .wpcf7-form-control-wrap{
    width: auto;
}