@charset "UTF-8";

/* ------------------------------------------------------------- */
/* 基本設定 */
/* ------------------------------------------------------------- */

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

html { font-size: 62.5%;}
html, body { height: 100%;}

body { margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif; color: #333; font-size: 1.4rem; line-height: 1.8em;}

@media (min-width: 1200px) {
  .container { width: 1170px !important;}
}

p { margin: 0; padding: 0 0 30px 0; text-align: justify; font-feature-settings: "palt"; letter-spacing: 0.06em;}
p.pb_0 { padding-bottom: 0;}

p.caption { font-size: 1.2rem;}
p.right { text-align: right;}


/* ------------------------------------------------------------- */
/* リンク */
/* ------------------------------------------------------------- */

a:link { color: #333; text-decoration: none;}
a:visited { color: #333;}
a:hover { color: #be8f7a;}
a:active { color: #333;}


/* ------------------------------------------------------------- */
/* 見出し */
/* ------------------------------------------------------------- */

h1 {}
h2 { font-size: 2.4rem; font-weight: normal; margin: 0 0 40px 0 ; padding: 20px 0; color: rgba(18,114,195,1.0); border-top: 2px solid #d2e4f3; border-bottom: 2px solid #d2e4f3; position: relative;}
h2 span { font-size: 1.6rem; font-family: Arial, Helvetica, "sans-serif"; color: #d2e4f3; position: absolute; right: 0; top: 40%;}
h3 { font-size: 1.8rem; font-weight: normal; margin: 0 0 20px 0; padding: 0;}
h4 { font-size: 1.6rem; font-weight: normal; margin: 0 0 12px 0; padding: 0;}
h5 { display: inline-block; font-size: 1.4rem; color: #fff; padding: 4px 10px; background: rgba(18,114,195,1.0);}

@media screen and (max-width: 767px) {
 h2 { font-size: 2.2rem; text-align: center; padding: 30px 0 10px 0;}
 h2 span { font-size: 1.4rem; font-family: Arial, Helvetica, "sans-serif"; color: #d2e4f3; position: absolute; right: 0; left: 0; top: 10px;}
 h3 { font-size: 2.0rem;}
 h3 { font-size: 1.8rem;}
 h4 { font-size: 1.4rem;}
}


/* ------------------------------------------------------------- */
/* 画像レスポンシブ */
/* ------------------------------------------------------------- */

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


/* ------------------------------------------------------------- */
/* 共通部品 */
/* ------------------------------------------------------------- */

.loader { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background-image: url(../images/loader.png); background-repeat: no-repeat; background-position:  center center; background-size: 30px 30px; background-color: #fff;}


/* PCスマホ要素切り替え */
.pc_parts { display: block;}
.smp_parts { display: none;}

@media screen and (max-width: 767px) {
.pc_parts { display: none;}
.smp_parts { display: block;}
}

/* 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: 767px) {
.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: 767px) {
.cl_sm20 { margin-bottom: 20px !important;}	
.cl_sm40 { margin-bottom: 40px !important;}	
}

/* 共通クリアランス */
.cl_10 { margin-bottom: 10px !important;}
.cl_30 { margin-bottom: 30px !important;}
.cl_50 { margin-bottom: 50px !important;}
.cl_100 { margin-bottom: 100px !important;}


/* 共通クリアランス */
.top_padd100 { padding-top: 100px;}

@media screen and (max-width: 991px) {
 .top_padd100 { padding-top: 0;}
}

/* smp版改行 */
br.brlong { display: none !important; width: 0 !important; height: 0 !important; visibility: hidden !important; content: ""; font-size:0;}

@media screen and (max-width: 768px) {
br.brlong { display: block !important;}	
}

/* 箇条書きリスト */
ul.itemized_list li { margin: 6px 0;}

/* 横並び定義リスト */
dl.float_list {}
dl.float_list dt { padding: 6px 0;  float: left;}
dl.float_list  dd { padding: 6px 0; margin-left: 100px;}

/* 詳しくボタン */
a.detail_btn { display: block; width: 200px; padding: 6px 0; background: #be8f7a; font-size: 1.2rem; text-align: center; color: #fff; font-weight: bold; border-radius: 6px; margin: 0 auto;}
a.detail_btn:link { color: #fff;}
a.detail_btn:visited { color: #fff;}
a.detail_btn:hover{ background: #cfb4a7;}

@media screen and (max-width: 768px) {
	a.detail_btn { width: 160px;}
}

/* 共通テーブル */
table.common_table { width: 100%; margin: 0; border-collapse: collapse; border-bottom: 1px solid #d2e4f3;}
table.common_table tbody th { width: 18%; padding: 10px; border-top: 1px solid #d2e4f3; border-right: 1px solid #d2e4f3; vertical-align: middle;}
table.common_table tbody td { padding: 10px; background: #fff; border-top: 1px solid #d2e4f3; border-right: 1px solid #d2e4f3; vertical-align: middle;}
table.common_table tbody td.center { text-align: center;}
table.common_table tbody th:last-child { border-right: none;}
table.common_table tbody td:last-child { border-right: none;}

table.common_table tbody th.per_20 { width: 20%;}
table.common_table tbody th.per_30 { width: 30%;}

@media screen and (max-width: 767px) {
table.common_table { }
table.common_table tbody th { display:block; width: 100%; padding: 4px 0; text-align: center; border-bottom: 1px solid #d2e4f3; border-right: none; background: #e8eff5;}
table.common_table tbody td { display:block; width: 100%; padding: 10px 0; margin-top: 0; border-top: none; border-right: none;}
 
 table.common_table tbody th.per_20 { width: 100%;}
 table.common_table tbody th.per_30 { width: 100%;}
}

/* 共通テーブル狭いスマホ用 */
table.narrow_table { width: 100%; margin: 0; border-collapse: collapse; border: 1px solid #f6e9e2;}
table.narrow_table tbody th { padding: 6px; border-top: 1px solid #f6e9e2; background: #faf5f2; text-align: center;}
table.narrow_table tbody td { padding: 6px; background: #fff; border-top: 1px solid #f6e9e2; vertical-align: middle;}
table.narrow_table  tbody th:last-child { border-bottom: none;}
table.narrow_table  tbody td:last-child { border-bottom: none;}



/* ------------------------------------------------------------- */
/* ヘッダー・ドロアメニュー */
/* ------------------------------------------------------------- */

/* トグルボタン */
#contents_wrapper { margin: 0; padding: 0; transition: transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);}
#navTgl:checked ~ #contents_wrapper { transform: translateX(-250px);}

label.open, label.close { display: none;}

@media screen and (max-width: 767px) {
 label.open, label.close { display: block;}
}

#navTgl { display: none;}
label { cursor: pointer; position: fixed; top: 0; right: 0; z-index: 21 !important;}
.open { z-index: 20; width: 64px; height: 64px; background: rgba(18,114,195,0.9); transition: background .6s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);}

.open::before,.open::after { content: "";}
.open span, .open::before, .open::after { content: ""; position: absolute; top: calc(50% - 1px); left: 30%; width: 40%; border-bottom: 1px solid #fff; transition: transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);}

.open::before { transform: translateY(-8px);}
.open::after { transform: translateY(8px);}

.close { z-index: 1; width: 100%; height: 100%; pointer-events: none; transition: background .2s;}

#navTgl:checked + .open { transform: translateX(-250px);}
#navTgl:checked + .open span {transform: scaleX(0);}
#navTgl:checked + .open::before { transform: rotate(45deg);}
#navTgl:checked + .open::after {transform: rotate(-45deg);}
#navTgl:checked ~ .close { pointer-events: auto;}

/* ドロアメニュー */
.menu { z-index: 22; position: fixed; overflow: auto; top: 0; right: 0; width: 250px; height: 100%; margin: 0; padding: 10px; background: rgba(18,114,195,1.0); transform: translateX(100%); transition: transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);}

.menu a { color: #fff;}
.menu ul li { line-height: 1.4em;}
.menu ul li:not(:first-child) { border-top: 1px solid rgba(255,255,255,0.2);}
.menu ul li a { display: block; padding: 0.6em 1em;}
.menu ul li a span { margin-left: 6px; font-size: 1.8rem !important;}

.menu ul li ul li { font-size: 1.2rem; border: none !important;}
.menu ul li ul li a { display: block; padding: 0.2em 0em 1.0em 2em;}


#navTgl:checked ~ .menu { transform: none;}

/* ヘッダー */
header { width: 100%; position: absolute; top: 0; left: 0; z-index: 10; -webkit-transition:0.5s ease-in-out;	transition:0.5s ease-in-out;}
header h1.pc_logo { width: 200px; height: 53px; margin: 0; padding: 0; position: absolute; top: 20px;text-indent: 100%; white-space: nowrap; overflow: hidden; background-image: url(../images/logo_head.png); background-repeat: no-repeat; background-size: cover;}
header h1.sp_logo { display: none; width: 138px; height: 60px; margin: 0; padding: 0; position: absolute; top: 10px; left: 20px;}

header ul { margin: 0; padding: 0; list-style-type: none; position: absolute; top: 46px; right: 0;}
header ul li { display: inline-block; font-size: 1.4rem; color: #fff; margin-left: 20px;}
header ul li:last-child { margin-left: 0;}
header ul li:nth-of-type(7) { font-size: 3.0rem; font-family: Arial, Helvetica, "sans-serif"; color: #3abf08; position: absolute; top: -30px; right: 0;}
header ul li i { width: 120px; height: 21px; content: ""; background-image: url("../images/phone.png"); background-repeat: no-repeat; background-size: 120px 21px; position: absolute; top: 2px; left: -126px;}

header ul li a { -webkit-transition: 0.3s; transition: 0.3s;}
header ul li a:link { color: #fff;}
header ul li a:visited { color: #fff;}
header ul li a:hover { color: rgba(255, 241, 0, 1.0);}
header ul li a:active { color: #fff;}

/* 70ピクセルスクロールでヘッダーを画面外に隠す */
header.out_header { top: -70px;}

/* 300ピクセルスクロールでヘッダーを固定 */
header.fix_header { height: 80px; background: rgba(240,240,240,0.8); position:  fixed; top: 0;}
header.fix_header h1 { top: 20px; width: 143px; height: 38px; background-image: url("../images/logo_head-fix.png")}
header.fix_header ul { top: 32px;}
header.fix_header ul li { margin-top: 16px;}
header.fix_header ul li:nth-of-type(7) { top: -32px;}

header.fix_header ul li a:link { color: #333;}
header.fix_header ul li a:visited { color: #333;}
header.fix_header ul li a:hover { color: #C0B50C;}
header.fix_header ul li a:active { color: #333;}

@media screen and (max-width: 767px) {
 header h1.pc_logo { display: none;}
	header h1.sp_logo { display: block;}
	header ul { display: none;}
 header.fix_header { display: none;}
}



/* ------------------------------------------------------------- */
/* フッター */
/* ------------------------------------------------------------- */

footer { padding: 60px 0; background: rgba(18,114,195,1.0);}
footer ul { width: 100%; margin: 0 0 90px 0; padding: 0; list-style-type: none;}
footer ul li { float: left; margin-right: 20px;}
footer a:link { color: #fff;}
footer a:visited { color: #fff;}
footer a:hover { color: #ebce8b;}
footer a:active { color: #fff;}

footer p { color: #fff; text-align: right; padding-bottom: 0;}

@media screen and (max-width: 767px) {
 footer ul { display: none;}
 footer p { font-size: 1.2rem; text-align: center;}
}

/* SNS */
ul#snsicons { height: 48px; margin: 0; padding: 0; list-style-type: none; position: fixed; bottom: 20px; left: 20px; z-index: 10; }
ul#snsicons li { width: 48px; heigh: 48px; margin-right: 20px; float: left;}


/* ------------------------------------------------------------- */
/* UI */
/* ------------------------------------------------------------- */

/* ページ先頭に戻るボタン */
#btnTop { display: table; width: 40px; height: 40px; background-color: rgba(18,114,195,0.6); text-align: center; color: #fff; position: fixed; bottom: -50px; right: 20px; z-index: 1; border-radius: 4px; -webkit-transition:1.0s ease-in-out; transition:1.0s ease-in-out;
}
a#btnTop:link { text-decoration: none;}
a#btnTop:hover { background-color: rgba(18,114,195,0.9);}
#btnTop i { display: table-cell; vertical-align: middle; font-size: 30px;}
#btnTop.disp { bottom: 20px; z-index: 6;}

/* 汎用ボタン */
a.common_btn { display: block; width: 200px; margin: 0 auto; padding: 12px 0; background: #edce08; border-radius: 6px; text-align: center; font-size: 1.6rem; color: #fff;}

a:link.common_btn { color: #fff;}
a:visited.common_btn { color: #fff;}
a:hover.common_btn { color: #fff; text-decoration: none; background: #0f7fb1;}
a:active.common_btn { color: #fff;}


/* ------------------------------------------------------------- */
/* メインビジュアル */
/* ------------------------------------------------------------- */

#pc_slide_wrapper { width: 100%; height: 100vh; overflow: hidden; position: absolute;}
#smp_slide_wrapper { height: 100vh; width: 100%; display: none; overflow: hidden; position: absolute;}

.catch-content { height: 40px; position: absolute; top: 46%; left: 14%;}
.catch-content h2 { font-size: 3.2rem; line-height: 1.6em; text-shadow: 0 0 10px rgba(0,0,0,.8); color: #fff; margin: 0; padding: 0; border: none !important;}

@media screen and (max-width: 767px) {
 #pc_slide_wrapper { height: 100vh;}
 #smp_slide_wrapper { display: block;}
 .catch-content { left: 0; right: 0; margin-left: 0; margin-right: 0;}
 .catch-content h2 { font-size: 5.6vw; text-align: center;}
}



/* ------------------------------------------------------------- */
/* ヘッダービジュアル下駄（ビジュアルがabsoluteのため） */
/* ------------------------------------------------------------- */

#visual_height_adjust { width: 100%; height: 100px; position: relative;}
#visual_height_adjust.top_wrapper { height: 100vh;}


/* ------------------------------------------------------------- */
/* ラッパー */
/* ------------------------------------------------------------- */

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

@media screen and (max-width: 767px) {
 main { padding: 60px 0;}
}

/* ------------------------------------------------------------- */
/* ボトムページ */
/* ------------------------------------------------------------- */

/* ボトムビジュアル */
.bottom_visual { width: 100%; height: 400px; position: relative;}

.bottom_visual#profile { background-image: url("../images/btm_profile_visual.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center top;}
.bottom_visual#work { background-image: url("../images/btm_work_visual.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center top;}
.bottom_visual#faq { background-image: url("../images/btm_faq_visual.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center top;}
.bottom_visual#recruit { background-image: url("../images/btm_recruit_visual.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center top;}

@media screen and (max-width: 767px) {
 .bottom_visual { width: 100%; height: 260px;}
 .bottom_visual#profile { background-position: 70% top;}
 .bottom_visual#work { background-position: 30% top;}
 .bottom_visual#faq { background-position: 46% top;}
 .bottom_visual#recruit { background-position: 90% top;}
}

/* グーグルマップグレイ */
.gray { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%);}


/* よくある質問 */
dl.faq_list { margin-left: 0; margin-right: 0; margin-top: 0; padding: 0;}
dl.faq_list dt { font-weight: normal; line-height: 1.8em; color: #1272c3; text-indent: -1.6em; margin: 0 0 20px 24px; cursor: pointer;}
dl.faq_list dt:before { content: "Q. "; font-size: 1.8rem; color: #1272c3; font-weight: normal;}
dl.faq_list dd { margin: 0 0 30px 46px; line-height: 1.8em; position: relative; text-indent: -1.7em; display: none;}
dl.faq_list dd:before { content: "A. "; font-size: 1.8rem; color: #f12244;}

dl.faq_list dt.q_open { color: #333; text-indent: 0; margin-left: 0; padding: 10px 10px 10px 24px; background: #e8eff5;}
dl.faq_list dt.q_open:before { content: "";}

/* 解体作業の流れ */
ol.flow { margin: 0; padding: 0;}
ol.flow li { padding: 20px; margin-bottom: 30px; border: 1px solid #e8eff5; position: relative;}
ol.flow li:after {
 content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 16px 0 16px;
    border-color: #e8eff5 transparent transparent transparent;
 position: absolute;
 bottom: -20px;
 left: 46%;
}
ol.flow li:last-child:after { content: none;}


/* 応募フォームボタン */
.btn_wrapper { text-align: center;}
a.btn-info:link { color: #fff;}
a.btn-info:visited { color: #fff;}
a.btn-info:hover { color: #fff;}
a.btn-info:active { color: #fff;}