@charset "UTF-8";
/* ######################################################################################

　申込フォームレスポンシブ対応

###################################################################################### */
@media print, screen and (min-width: 768px) {}
@media screen and (max-width: 767px) {}

@media print, screen and (min-width: 768px) {
	.formPage h2{font-size: 24px!important;}
	.formPage #mainFrom {
		width: 940px!important;
		margin: 0 auto;
		padding: 30px auto;
	}
}

@media screen and (max-width: 767px) {
	#hNavi,
	#globalNavi,
	#fNavi{display: none!important;}
	#headerArea{width: 100%;margin: 0;height: 80px;}
	#headerArea h1{float: none;margin: 0 auto;text-align: center;	width: 232px;
	height: 60px;}
	
	.formPage h2{font-size: 18px;}
	.form_information h3{font-size: 16px!important;}
	.form_information p.tel{margin-bottom: 20px!important;}
	.form_information p.tel a{font-size: 24px!important;}
	
	.formPage #mainFrom {
		width: 90%!important;
		margin: 0 auto;
	}
	.form_information{padding: 70px 20px 30px!important;}
	.form_information .buttonBox .button{font-size: 13px!important;}
	h3.titleLeftLine{font-size: 16px!important;}
}


.formPage{color: #333;}
/* ============================================
	form_contents
============================================ */
h3.titleLeftLine{
	color: #003329;
	font-size: 20px;
	margin-bottom: 1.25em;
    position: relative;
}
h3.titleLeftLine span{
	position: relative;
    display: inline-block;
    padding-left: 0.75em;
    border-left: 3px solid #003329;
    border-left-style: solid;
    text-decoration: none;
}

/* ============================================
	form_information
============================================ */
.form_information{
	background: #fff;
	border-radius: 10px;
	padding: 70px 60px 30px;
	position: relative;
	margin-bottom: 30px;
}
.form_information:before{
	content: url('../../images/contact/flag.png');
    display: block;
    width: 327px;
    height: auto;
    position: absolute;
    top: -20px;
    left: 0;
	right: 0;
	margin: auto; 
}
.form_information:after{
	content: url('../../images/contact/img_02.png');
    display: block;
    width: 460px;
    height: auto;
    position: absolute;
    bottom: -0px;
	right: 0;
	z-index: 1;
}
.form_information h3{text-align: center;font-size:18px; font-weight: normal; margin-bottom: 10px; line-height: 1.7;}
.form_information p.tel{text-align: center;line-height: 1.0;}
.form_information p.tel a{color: #003329; font-size: 36px; font-weight:bold; margin-bottom: 10px;text-decoration: none; cursor: pointer;}
.form_information p.tel a:hover{color:#3A6F45; }
.form_information h4{font-size:16px;border-bottom: 1px solid #CCCCCC; padding: 10px 0; margin-bottom: 20px;}
.form_information ul{ margin: 0 0 10px 0; list-style: square!important; padding-left: 20px;}
.form_information ul li{font-size: 14px;list-style-type: circle!important;}
.form_information .buttonBox{text-align: center;}
.form_information .buttonBox .button{
    background: #6DC44B;
    color: #ffffff;
    font-weight: bold;
    line-height: 1.0;
	font-size: 15px;
	border-radius:6px; 
	z-index: 3;
	}

.buttonBox .button{cursor: pointer; text-decoration: none;}

.buttonBox .button.brown{
    background: #60352A;
    color: #ffffff!important;
    font-weight: bold;
    line-height: 1.0;
	font-size: 15px;
	border-radius:6px; 
	z-index: 3;
	}

.buttonBox .button.gray{
    background: #888EA7;
    color: #ffffff;
    font-weight: bold;
    line-height: 1.0;
	font-size: 15px;
	border-radius:6px; 
	z-index: 3;
	}


/* ============================================
	Accompany form
============================================ */
#Accompany div.contactArea,
#Accompany_form div.contactArea{
	background-image: url(../../../images/acompany/bg-contact.png);
	width: 850px;
	height: 185px;
	margin-bottom: 30px;
}
#Accompany div.contactArea a,
#Accompany_form div.contactArea a{
	display: block;
	margin-left: 505px;
}
#Accompany div.contactArea a.tel,
#Accompany_form div.contactArea a.tel{
	padding-top: 20px;
	margin-bottom:15px;	
	}


#Accompany_form{text-align: left;padding-top: 30px;	padding-bottom: 40px;}

#Accompany_form .attention,#Accompany_form .error{
	color: #D90000;
	font-weight: bold;
	font-size: 90%;
}
#Accompany_form span.necessary{color: #FFFFFF;font-weight: bold;background-color: #D90000;}

#Accompany_form a:hover{filter: alpha(opacity=70);	-moz-opacity:0.70;	opacity:0.70;}
#Accompany_form table{
	border-left-color: #C5CBCD;
	border-top-color: #C5CBCD;
	border-left-style: solid;
	border-top-style: solid;
	border-left-width: 1px;
	border-right-width: medium;
	border-top-width: 1px;
	font-size: 100%;
}
#Accompany_form th,#Accompany_form td{
	order-left-color: #C5CBCD;
	border-right-color: #C5CBCD;
	border-bottom-color: #C5CBCD;
	border-right-style: solid;
	border-bottom-style: solid;
	border-right-width: 1px;
	padding: 0.8em 1em ;
	border-bottom-width: 1px;
}
#Accompany_form th{
	background-color: #E2E4E0;
}
#Accompany_form th img{
	margin-top: 2px;
}
#Accompany_form td{	background-color: #fff;}


#Accompany_form .errorms{
	color: #D90000;
	font-weight: bold;
	text-align: center;
	border: 1px solid #D90000;
	padding: 20px;
	margin-bottom: 50px;
	margin-top: 10px;
	background: #fff
}
#Accompany_form p strong{
	color: #F54390;
}
/* ============================================
	pageForm
============================================ */

.formPage h2{
	background:#FFF; 
	color:#003329;
	display: block;
	padding: 40px 0;
	border-bottom: 1px solid #E8E8CC;
	text-align: center;
}



/* ====================================================
button
==================================================== */
.button.white{background: #fff;}
.button.green,
.button.white{
    font-size: 16px;    
}

/* ====================================================
greenBgTitle
==================================================== */
.greenBgTitle.large{padding: 0.7em 0.6em;}
@media print, screen and (min-width: 768px) {
    .greenBgTitle.large{font-size: 18px;}
    * + .greenBgTitle.large{margin-top: 30px; margin-bottom: 10px; }
}
@media screen and (max-width: 767px) {
}


/* ====================================================
titleLeftLine
==================================================== */
.titleLeftLine {
    margin-bottom: 1.25em;
    position: relative;
    color: #009944;
}
.titleLeftLine span {
    position: relative;
    display: inline-block;
    padding-left: 0.75em;
    border-left: 3px solid #009935;
    border-left-style: solid;
    text-decoration:none;
}

@media print, screen and (min-width: 768px) {
	.titleLeftLine{font-size: 20px;}
    * + .titleLeftLine{margin-top: 75px;}
}
@media screen and (max-width: 767px) {
	.titleLeftLine{font-size: 18px;}
	.titleLeftLine em{display: block; margin-top: 0.25em; margin-left: 1.4em;}
    * + .titleLeftLine{margin-top: 60px;}
}




/* ====================================================
radioButtonList
==================================================== */
.radioButtonList{align-items: center;}
.radioButtonList + *{margin-top: 1em;}
.radioButtonList input[type="radio"] + label, .radioButtonList input[type="radio"] + span{display: inline-block;}
.radioButtonList input[type="radio"] + label:before, .radioButtonList input[type="radio"] + span:before{
    width: 26px;
    height: 26px;
}
.radioButtonList input[type="radio"] + label:after, .radioButtonList input[type="radio"] + span:after{
    width: 14px;
    height: 14px;
}
.radioButtonList input[type="radio"]:checked + label:before, .radioButtonList input[type="radio"]:checked + span:before{border-color: #0060C1;}

@media print, screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
    .radioButtonList.spVertical{flex-direction: column;}
    .radioButtonList.spVertical .radioButtonList__item{width: 100%; margin-right: 0;}
    .radioButtonList.spVertical .radioButtonList__item + .radioButtonList__item{margin-top: 0.75em;}
}

/* radioボタンと入力枠の横並び */
@media print, screen and (min-width: 768px) {
    .radioButtonWarp .radioButtonList + .radioButtonList{margin-top: 0; margin-left: 30px;}
    .radioButtonWarp{display: flex;}
    .radioButtonWarp .radioButtonList{display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center;}
    .radioButtonWarp .radioButtonList__item {
        padding-top: 0.6em;
        height: 100%;
        min-height: 0%;
        width: 100%;
        margin: 0;
        display: flex;
        align-items: flex-start;
    }
    .radioButtonWarp .radioButtonList__item + .radioButtonList__item{margin-top: 1em;}
    .radioButtonWarp .radioButtonList__item label{padding-bottom: 0.25em;}
    .radioButtonWarp .radioButtonList.text .radioButtonList__item{padding-top: 0;}
}
@media screen and (max-width: 767px) {
    .radioButtonWarp .radioButtonList__item{width: 100%;}
    .radioButtonWarp .radioButtonList__item.empty{display: none;}
    .radioButtonWarp .radioButtonList.text{margin-top: 0;}
}

/*確認画面*/
.radioButtonList{align-items: flex-start;}

/* ====================================================
checkButtonList
==================================================== */
.checkButtonList__item{margin-bottom: 1em;}
.radioButtonList input[type="checkbox"] + label, .radioButtonList input[type="checkbox"] + span{display: inline-block;}
.checkButtonList input[type="checkbox"]:checked + label:after, .checkButtonList input[type="checkbox"]:checked + span:after {
    content: "";
    left: 1px;
    background: url(../img/contents/share/ico-check.svg) center no-repeat;
    background-size: 60%;
    background-color: #004BB1;
    width: 30px;
    height: 30px;
    border-radius: 2px;
    border: 1px solid #004BB1;
}
.checkButtonList__item .small{font-size: 13px;}

@media print, screen and (min-width: 768px) {
    .checkButtonList__item{padding-top: 0.25em; margin-right: 3em;}
}
@media screen and (max-width: 767px) {
}


.checkButtonList input[type="checkbox"] + label:before,
.checkButtonList input[type="checkbox"] + label:after,
.checkButtonList input[type="checkbox"] + span:before,
.checkButtonList input[type="checkbox"] + span:after{
    top: -0.1em;
    transform: none;
}



/* vertical
-------------------------------------*/
.checkButtonList.vertical{flex-direction: column;}
.checkButtonList.vertical .checkButtonList__item{padding-top: 0; margin-bottom: 0.25em; margin-right: 0;}
.checkButtonList.vertical .checkButtonList__item label{padding-top: 0.35em; padding-bottom: 0.35em;}
.checkButtonList.vertical label{display: inline-block; width: 100%;}

@media print, screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}

/* disabled
-------------------------------------*/
form .disabled{
    position: relative;
    pointer-events: none;
    background: #F8F8F8;
    color: #BABED1;
    display: inline-block;
}
form .disabled input[type="text"],
form .disabled input[type="radio"] + span:before,
form .disabled input[type="checkbox"] + span:before,
form .disabled textarea,
form .disabled select,
form .select.disabled select{
    background: #F8F8F8;
}
form .select.disabled{
    display: inline;
}

.formItem input[type="text"] + input[type="text"],
.formItem input[type="email"] + input[type="email"],
.formItem input[type="email"] + div.input {margin-top: 1em;}


.memberBox {display: none;}
.memberBox.active {display: block;}
@media print, screen and (min-width: 768px) {
    .memberBox {margin-top: 75px;}
}
@media screen and (max-width: 767px) {
    .memberBox {margin-top: 60px;}
}



/* ====================================================
フォームレイアウト
==================================================== */
/* formItem
-------------------------------------*/
.formItemWarp{border-top: 1px solid #CDD6DD;}
.formItem{border-bottom: 1px solid #CDD6DD;}
.formItem.noBd{border-bottom: none;}
.formItem__title{font-weight: bold; display: block; font-size: 16px; line-height: 1.625;}
.formItem__title img{vertical-align: middle;}
.formItem__title .small{font-size: 13px;}
.formItem__parts{font-size: 15px;}

@media print, screen and (min-width: 768px) {
    .formItemWarp{padding-top: 20px; margin-bottom: 80px;}
    .formItem{padding-bottom: 20px; margin-bottom: 20px; display: flex; justify-content: space-between;}
	.formItem.zero{padding-bottom: 0px; margin-bottom: 20px; display: flex; justify-content: space-between; border: none!important;}
    .formItem__title{width: 200px; padding-top: 0.5em;}
    .formItem__title.pt0{padding-top: 0;}
    .formItem__title__guide{float: right; font-size: 13px;}
    .formItem__parts{width: calc(100% - 220px);}
}
@media screen and (max-width: 767px) {
    .formItemWarp{padding-top: 15px;}
    .formItem{padding-bottom: 15px; margin-bottom: 15px;}
    .formItem__title{width: 100%;}
    .formItem__parts{width: 95%;}
    .formItem__title{margin-bottom: 0.5em;}
	.radioButtonList{display: inherit;margin: 0;}
	
}



/* 縦並びリスト
-------------------------------------*/
.formVerticalList__item + .formVerticalList__item{margin-top: 0.5em;}

/* 氏名
-------------------------------------*/
.nameInputList{max-width: 580px; display: flex; justify-content: space-between;}
.nameInputList__item{width: 48.27%;}
.nameInputList__item input{width: 100%;}

/* select　タイトル
-------------------------------------*/
.selectLable{margin-bottom: 0.25em; font-weight: bold; font-size: 15px;}




/* ====================================================
フォームサイズ
==================================================== */
@media print, screen and (min-width: 768px) {
    .input-size-ss{width: 4em;}
    .input-size-s{width: 180px;}
    .input-size-m{width: 280px;}
    .input-size-l{width: 580px;}

    .select.input-size-l,
    .select.input-size-l select{width: 580px;}
}
@media screen and (max-width: 767px) {
    .input-size-ss{width: 4em;}
    .input-size-s{width: 180px;}
    .input-size-m{width: 280px;}
    .input-size-l{width: 100%;}

    .select.input-size-l,
    .select.input-size-l select{width: 100%;}
}


.mw_wp_form .error{
    font-size: 15px;
    font-weight: bold;
    color: #DC0000;
}
.mw_wp_form .error::before{
    content: "※";
}

/* ====================================================
必須
==================================================== */
.required{
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: 0;
    background: #DC0000;
    border-radius: 3px;
    padding: 0.5em;
    margin-left: 0.5em;
    line-height: 1;
    color: #ffffff;
    font-size: 11px;
    font-weight: bold;
}

/* ====================================================
任意
==================================================== */
.optional{
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: 0;
    background: #BABED1;
    border-radius: 3px;
    padding: 0.5em;
    margin-left: 0.5em;
    line-height: 1;
    color: #ffffff;
    font-size: 11px;
    font-weight: bold;
}



/* ====================================================
formInlineText
==================================================== */
@media print, screen and (min-width: 768px) {
    .formInlineText{display: inline-block; margin-left: 0.5em;}
}
@media screen and (max-width: 767px) {
    .formInlineText{display: block; margin-top: 0.25em;}
}


/* ====================================================
注意書き　formGuide
==================================================== */
.formGuide{margin-bottom: 0; font-size: 14px; font-feature-settings: "palt"; color: #DC0000;}
.formGuide a{color: #DC0000!important;}
* + .formGuide{margin-top: 0.5em;}
.formGuide + *{margin-top: 0.5em;}

.formGuide.redBorder{
    padding: 1em 1.5em;
    border: 1px solid #CC0000;
    color: #CC0000;
    font-size: 14px;
    line-height: 1.85;
}
.formGuide.redBorder + *{margin-top: 1.5em;}
.formItemWarp + .formGuide.redBorder{margin-top: 30px;}


/* ====================================================
注意書き　formAttention
==================================================== */
.formAttention p{margin-bottom: 2em; font-size: 14px; line-height: 1.85; word-break: break-all;}
.formAttention .grayBgTitle{margin-bottom: 1.25em; font-size: 18px;}
.formAttention a{color: #004BB1;}
@media print, screen and (min-width: 768px) {
    .formAttention{margin-top: 80px;}
}
@media screen and (max-width: 767px) {
    .formAttention{margin-top: 60px;}
}

/* ====================================================
同意ボタン
==================================================== */

.buttonBox.form .checkButtonList{justify-content: center; align-items: center; margin-bottom: 2em;}

/* ====================================================
フォームボタン
==================================================== */
@media print, screen and (min-width: 768px) {
    .buttonBox.form{margin-top: 40px;}
	.buttonBox.form ul{display: flex; justify-content: space-between; max-width: 560px; margin-left: auto; margin-right: auto;}
	.buttonBox.form ul li{width: 45%;}
	.buttonBox.form ul li .button{width: 100%; }
}
@media screen and (max-width: 767px) {
    .buttonBox.form{margin-top: 30px; margin-bottom: 60px;}
	.buttonBox.form ul{display:inherit!important;}
	.buttonBox.form ul li{margin-bottom: 10px;}
	.buttonBox.form ul li .button{ }
}


/* ====================================================
入力画面
==================================================== */
.formmailer.input .formGuide.confirm{display: none;}
.formmailer.input .buttonBox.form ul{justify-content: center;}
.formmailer.input .buttonBox .back{display: none;}

/* ====================================================
確認画面
==================================================== */
.formmailer.confirm .formGuide,
.formmailer.confirm .fontUsually,
.formmailer.confirm .inputOnly,
.formmailer.confirm label.select:after{display: none;}
.formmailer.confirm .formGuide.confirm{display: block;}
.formmailer.confirm .nameInputList{justify-content: flex-start;}
.formmailer.confirm .nameInputList__item{width: auto;}
.formmailer.confirm .selectLable{display: inline-block;}
.formmailer.confirm .radioButtonWarp{display: block;}
.formmailer.confirm .radioButtonWarp .radioButtonList__item.empty{display: none;}
.formmailer.confirm .radioButtonWarp .radioButtonList.text .radioButtonList__item{margin: 0;}

@media print, screen and (min-width: 768px) {
    .formmailer.confirm .formItem{padding-bottom: 15px; margin-bottom: 15px;}
    .formmailer.confirm .formItem.topBd{padding-top: 15px;}
    .formmailer.confirm .formItem__title{padding-top: 0; width: 200px;}
    .formmailer.confirm .formItem__parts{width: calc(100% - 230px);}
    .formmailer.confirm .formVerticalList.confirmHorizon .formVerticalList__item{display: inline-block; margin-top: 0;}
}
@media screen and (max-width: 767px) {
    .formmailer.confirm .formItem__title{}
    .formmailer.confirm .radioButtonWarp .radioButtonList__item br.sp{display: none;}
}



/* ====================================================
完了画面
==================================================== */
.formThanks__mailTitle{
    padding: 0.5em 1em;
    border: 1px solid #009944;
    color: #009944;
    font-weight: bold;
}
.mw_wp_form.mw_wp_form_send_error {
    margin-bottom: 2em;
    padding: 1.5em 0.5em;
    background: #FFE6E6;
    border: 3px solid #DD0404;
    text-align: center;
    color: #E01818;
    font-weight: bold;
}

@media print, screen and (min-width: 768px) {
    .formThanks + *{margin-top: 90px;}
    .formThanks .boldTitle{margin-bottom: 1.5em; text-align: center; font-size: 26px;}
    .formThanks p{text-align: center; margin-bottom: 2em; font-size: 16px;}
    .formThanks .formThanks__mailTitle{font-size: 18px;}
}
@media screen and (max-width: 767px) {
    .formThanks .boldTitle{margin-bottom: 1.5em; text-align: center; font-size: 20px; line-height: 1.5;}
    .formThanks .boldTitle.spLeft{text-align: left;}
    .formThanks + *{margin-top: 60px;}
    .formThanks .formThanks__mailTitle{font-size: 16px;}
}









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

==================================================== */
/* 
-------------------------------------*/
@media print, screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}