@charset "UTF-8";

* { margin: 0; padding: 0; box-sizing: border-box;}

html { height: 100%; font-size: 62.5%; scroll-behavior: smooth; scroll-padding-top: 20px;}
html, body { height: 100%;}

body { font-size: 1.4rem; line-height: 1.7em; font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif"; color: #333; background: #fff;}

a:link { color: #5b9c5f; text-decoration: none;}
a:visited { color: #5b9c5f;}
a:hover { color: #5b9c5f; text-decoration: underline}
a:active { color: #5b9c5f;}

/* 見出しテキスト */
h1 { font-size: 2.2rem;}
h2 { }
h3 { font-size: 1.8rem; color: #3c6d45; margin: 0 0 10px 0; padding: 0;}
h4 { font-size: 1.6rem; margin: 0 0 10px 0; padding: 0;}
h5 { }

p { font-size: 1.4rem; line-height: 2.0em; text-align: justify; font-feature-settings: "palt"; letter-spacing: 0.08em;}

p.strong { font-size: 1.5rem; color: #5b9c5f;}
p.center { text-align: center;}
p.right { text-align: right;}
p.note { font-size: 1.2rem; line-height: 1.5em;}

strong { color: #c29c28;}

/* 
@media screen and (max-width: 800px) {
	h1 { font-size: 1.8rem;}
	h2 { }
 h4 { }
 h5 { }
 p { }
}
*/

ol { margin: 10px 0 0 20px; list-style-type: decimal;}
ol li { margin-bottom: 10px;}

img.img-responsive { width: 100%; height: auto;}

.pc_part { display: block;}
.smp_part { display: none;}
.width_narrow { width: 80%; margin-left: auto; margin-right: auto;}

/*
@media screen and (max-width: 800px) {
.pc_part { display: none;}
.smp_part { display: block;}
	.width_narrow { width: 100%;}
}
*/

/* pc版クリアランス */
.cl_pc120 { margin-bottom: 120px !important;}
.cl_pc100 { margin-bottom: 100px !important;}
.cl_pc80 { margin-bottom: 80px !important;}
.cl_pc50 { margin-bottom: 50px !important;}
.cl_pc30 { margin-bottom: 30px !important;}

/*
@media screen and (max-width: 800px) {
.cl_pc120 { margin-bottom: 60px !important;}
.cl_pc100 { margin-bottom: 50px !important;}
.cl_pc80 { margin-bottom: 40px !important;}
.cl_pc50 { margin-bottom: 25px !important;}
.cl_pc30 { margin-bottom: 15px !important;}
}
*/

/* smp版クリアランス */
.cl_sm20 { margin-bottom: 10px !important;}
.cl_sm40 { margin-bottom: 20px !important;}

/*
@media screen and (max-width: 800px) {
.cl_sm20 { margin-bottom: 20px !important;}	
.cl_sm40 { margin-bottom: 40px !important;}	
}
*/

/* 固定クリアランス */
.cl_10 { margin-bottom: 10px !important;}
.cl_20 { margin-bottom: 20px !important;}
.cl_30 { margin-bottom: 30px !important;}

/* コンテナ */
@media screen and (min-width: 1300px) {
  .container { width: 1270px; margin: auto;}
}

/*
@media screen and (max-width: 1299px) {
	.container { width: 100%; margin: auto; padding: 0 15px;}
}
*/

/* ダウンロードボタンラッパー */
.download_wrapper { width: 80%; padding: 40px 10px; margin: 20px auto; border-radius: 8px; text-align: center; background: #eff7fa;}
.download_wrapper a.common_btn { display: inline-block; width: 40%; margin: 0 1%; background: #53beef; color: #fff;}
.download_wrapper a.common_btn:link, .download_wrapper a.common_btn:visited, .download_wrapper a.common_btn:active, .download_wrapper a.common_btn:hover { background: #53beef; color: #fff;}
.download_wrapper a.common_btn:hover { background: #83ccee;}

/*
@media screen and (max-width: 800px) {
	.download_wrapper { width: 100%;}
	.download_wrapper a.common_btn { display: block; width: 86%; margin: 1% auto;}
}
*/

/* position:の基準点 */
.position_basis { position: relative;}

/* 標準ボタン */
button { background-color: transparent; border: none; cursor: pointer; outline: none; appearance: none;}
button:disabled { pointer-events: none; opacity: 0.3;}

.common_btn { display: block; width: 60%; margin: auto; padding: 20px 6px; font-size: 2.4em; font-weight: bold; text-align: center; color: #fff; background: #c29c28; border-radius: 8px; transition: 0.3s all ease-out; position: relative;}

.common_btn.reset { background: #ddd; color: #333;}

/* 小さいボタン */
a.small_btn { display: inline-block; width: 200px; padding: 6px 0; margin: 10px 0; background: #c29c28; font-size: 2.0em; font-weight: bold; text-align: center; border-radius: 6px;}
a.small_btn.center { display: block; margin: 20px auto;}

a.small_btn:link, a.small_btn:visited, a.small_btn:hover, a.small_btn:active { color: #fff;}

/* 汎用テーブル */
table.common_table { width: 100%; border-collapse: collapse; table-layout: fixed;}
table.common_table th { text-align: left; background: #f6fff8;}
table.common_table th, table.common_table td { border: 1px solid #ddd; padding: 12px;}
table.common_table tr.text_center { text-align: center;}
table.common_table th.text_right, table.common_table td.text_right { text-align: right;}
/*
@media screen and (max-width: 800px) {
 table.common_table { table-layout: auto;}
	table.common_table th, table.common_table td { display: block; width: 100%; border: none;}
	table.common_table td:nth-of-type(odd){ background: #e0f0f8; border-top: 2px solid #fff;}
}
*/

/* 固定幅テーブル */
table.fixed_table { width: 100%; border-collapse: collapse;}
table.fixed_table th { text-align: center; background: #f6fff8}
table.fixed_table th, table.fixed_table td { border: 1px solid #ddd; padding: 8px;}
table.fixed_table td.text_right { text-align: right;}


/* ヘッダー */
header { width: 100%; padding: 16px 0; border-bottom: 6px solid #5b9c5f;}
header h2 { height: 50px; margin: 0; padding: 0;}
header h2:after { content: none;}
header h2 img { display: inline-block; width: auto; height: 100%;}
header h2 span { font-size: 1.2rem; color: #333; font-weight: normal; position: relative; top: -20px;}

/*
@media screen and (max-width: 800px) {
	header h2 { height: 40px;}
 header h2 span { font-size: 1.0rem;}
}
*/

/* タイトル */
.title_wrapper { width: 100%; padding: 16px 0;}
.title_wrapper h1 { height: 70px; line-height: 1.2em; color: #5b9c5f; padding: 10px 0 10px 70px; position: relative;}
.title_wrapper h1:before { content: ""; height: 70px; width: 89px; background: url("../../images/ibt/logo_meister.png") no-repeat; background-size: auto 100%; position: absolute; top: 0; left: 0;}

/* メイン */
main { padding: 60px 0 0 0;}

/* よくある質問 */
a.faq_float { display: block; width: 170px; padding: 6px 0; background: #c29c28; text-align: center; position: absolute; right: 0; top: -16px;}

a.faq_float:link, a.faq_float:visited, a.faq_float:hover, a.faq_float:active { color: #fff;}

/*
@media screen and (max-width: 800px) {
	a.faq_float { width: 100%; height: 40px; writing-mode: horizontal-tb; padding-right: 0; padding-top: 8px; top: auto; bottom: 0;}
}
*/

/* 申込みの流れ */
.flow_wrapper { padding: 20px 0; text-align: center;}
.flow_wrapper ul { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; flex-start: center; width: 100%; margin: 0 auto; padding: 0; list-style-type: none;}
.flow_wrapper ul li { display: flex; width: 20%; height: 42px; margin: 0; padding: 8px; font-size: 1.4rem; font-weight: bold; text-align: center; align-items: center; justify-content: center; background: #9cbd9f; position: relative;}
.flow_wrapper ul li:after { content: ""; width: 30px; height: 42px; background: url("../../images/ibt/flow_arrow.svg") no-repeat; background-size: cover; position: absolute; top: 0; right: -12px; z-index: 1;}
.flow_wrapper ul li.current:before { content: ""; width: 30px; height: 42px; background: url("../../images/ibt/flow_arrow_before.svg") no-repeat; background-size: cover; position: absolute; top: 0; left: -17px; z-index: 2;}
.flow_wrapper ul li:first-child:before { content: none;}
.flow_wrapper ul li.current:after { content: ""; width: 30px; height: 42px; background: url("../../images/ibt/flow_arrow_current.svg") no-repeat; background-size: cover; position: absolute; top: 0; right: -15px;}
.flow_wrapper ul li:last-child:after { content: none;}

.flow_wrapper ul li.current { color: #fff; background: #5b9c5f;}

/*
@media screen and (max-width: 800px) {
 .flow_wrapper ul { justify-content: left;}
	.flow_wrapper ul li { width: 49%; padding: 4px 8px;}
}

@media screen and (max-width: 535px) {
	.flow_wrapper ul li { width: 46%; margin: 1% 2%;}
}
*/

/* エクセルアイコン */
.icon_xls { display: inline-block; width: 18px; height: 23px; background: url("../../images/ibt/icon_xls.svg") no-repeat; background-size: cover; margin-right: 10px; position: relative; top: 4px;}

/* フッター */
footer { padding: 40px 0; text-align: center; border-top: 6px solid #5b9c5f;}
footer p { fon-size: 1.2rem; color: #333; text-align: center; margin-bottom: 0;}
footer h2 { height: 30px; text-align: center; padding: 0;}
footer h2:after { content: none;}
footer h2 img { width: auto; height: 100%; margin: 0 auto 10px auto;}

/*
@media screen and (max-width: 800px) {
	footer { padding-bottom: 60px;}
}
*/

/* ネクストバック */
.next_back_wrapper { padding: 60px 0; border-top: 1px solid #5b9c5f;}
.next_back_wrapper ul { display: flex; flex-wrap : wrap; margin: 0; padding: 0; list-style-type: none;}
.next_back_wrapper ul li { width: 48%; margin-left: auto; margin-right: auto; text-align: center;}
.next_back_wrapper ul li:first-child { order: 1;}
.next_back_wrapper ul li a { margin-bottom: 8px;}

/*
@media screen and (max-width: 800px) {
	.next_back_wrapper ul { display: block;;}
	.next_back_wrapper ul li { width: 80%; margin-bottom: 30px;}
}
*/

/* プライバシーポリシー */
.privacy_agree_wrapper { height: 300px; border: 1px solid #eee; padding: 16px; overflow: scroll; position: relative;}
.agree_check { display: block; width: 100%; padding: 10px; text-align: center; border: 1px solid #ffaf53; margin-left: auto; margin-right: auto; bottom: 0;}

/* 入力フォーム */
dl.form-horizontal { display: flex; flex-wrap: wrap; width: 100%;}
dl.form-horizontal dt { font-weight: normal; width: 40%; padding: 6px 0;}
dl.form-horizontal dd { width: 60%; padding: 6px 0;}

label { font-weight: normal;}
input[type=text], input[type=email], textarea { padding: 6px; font-size: 1.6rem; background: #fff; border-radius: 6px; border: 1px solid #ddd; outline: none;}

input[type=text].inline, input[type=email].inline { display: inline-block; margin-right: 10px;}

[type=text]:focus, [type=email]:focus, textarea:focus { border: 1px solid #c29c28; box-shadow: 1px 0 4px 1px #ffe3a3;}

.req { font-size: 1.0rem; line-height: 1.0em; font-weight: normal; vertical-align: 2px; margin-right: 5px; padding: 4px 6px; border-radius: 10px; background: #c29c28; color: #fff;}

/*
@media screen and (max-width: 800px) {
 dl.form-horizontal { display: block; padding: 0;}
 dl.form-horizontal dt { width: 100%; text-align: left; padding-bottom: 8px;}
 dl.form-horizontal dd { width: 100%;}
}
*/
/* エラー文言エリア */
.errorMessageArea { width: 100%; margin: 0 auto; color: #ff0000; text-align: center; font-weight: bold;}


/* 横スクロールエリア */
.holizon_scroll_wrapper { overflow-x: scroll;}
.holizon_scroll_wrapper table.fixed_table th, .holizon_scroll_wrapper table.fixed_table td { white-space: nowrap;}

dl.member_list dt { transition: 0.3s all ease-out; position: relative;}
dl.member_list dt span:before { display: block; content: "すべて見る"; font-size: 1.2rem; line-height: 1.0em; padding: 4px 10px; border-radius: 9999px; background-color: #EDE700; position: absolute; right: 0; top: 0;}
dl.member_list dd { height: 100px; overflow-y: hidden; transition: 0.3s all ease-out; position: relative;}
dl.member_list dd:before { content: ""; height: 100%; width: 100%; background: rgb(255,255,255); background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); background-position: left top;position: absolute; z-index: 1;}

dl.member_list dt.open_member span:before { content: "閉じる";}
dl.member_list dd.open_member { height: auto;}
dl.member_list dd.open_member:before { display: none;}
/* エラー文言エリア */
.errorMessage{
    width: 100%;
    margin: 0 auto;
    color: #ff0000;
    font-weight: bold;
}