﻿@charset "utf-8";
/* CSS Document */

#hd_login_msg { display:none !important; }

/* reset */
@font-face {
  font-family: 'Eulyoo1945';
  font-style:   normal;
  font-weight:  400;
  src: local('Eulyoo1945-Regular'),
	  url('/fonts/Eulyoo1945-Regular.eot'),
	  url('/fonts/Eulyoo1945-Regular.woff2') format('woff2'),
	  url('/fonts/Eulyoo1945-Regular.woff') format('woff'),
	  url('/fonts/Eulyoo1945-Regular.ttf') format('truetype'),
	  url('/fonts/Eulyoo1945-Regular.svg') format('svg');
}

@font-face {
  font-family: 'Eulyoo1945';
  font-style:   normal;
  font-weight:  500;
  src: local('Eulyoo1945-SemiBold'),
	  url('/fonts/Eulyoo1945-SemiBold.eot'),
	  url('/fonts/Eulyoo1945-SemiBold.woff2') format('woff2'),
	  url('/fonts/Eulyoo1945-SemiBold.woff') format('woff'),
	  url('/fonts/Eulyoo1945-SemiBold.ttf') format('truetype'),
	  url('/fonts/Eulyoo1945-SemiBold.svg') format('svg');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}
html,body, div, ul, li, p, figure, input, textarea{ font-family:'Eulyoo1945', sans-serif; letter-spacing: 0}
ul,ol,li{list-style:none}
div{ box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
a,a:link,a:active,a:visited,a:hover{text-decoration:none; color: #5f5f5f;}
span,span:focus{outline:none;border:0;background:none;padding:0;margin:0}
blockquote, q{quotes:none}
blockquote:before, blockquote:after, q:before, q:after{content:'';content:none}
legend, caption span{position:absolute;left:-9999em;top:0;width:0.1%;height:0.1%;text-indent:-999em;overflow:hidden;visibility:hidden}
table{border-collapse:collapse;border-spacing:0}
input:focus{ outline:none; -webkit-tap-highlight-color :transparent;}
input,select,textarea{-webkit-appearance:none;font-size:inherit;color:inherit}
input[type="radio"]{-webkit-appearance:radio}
input[type="checkbox"]{-webkit-appearance:checkbox}
input{ border-radius: 0 !important;}
button{outline:0;border:none;border-radius:0;background:none}
a:focus,button:focus{outline:none}
h1, h2, h3, h4, h5, h6{font-weight:normal}
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none; margin:0}
input::-webkit-input-placeholder{ color:#cbcbcb;} 
textarea::-webkit-input-placeholder{ color:#cbcbcb;}
input::-ms-input-placeholder{ color:#cbcbcb;}
textarea::-ms-input-placeholder{ color:#cbcbcb;}
input::-moz-placeholder{ color:#cbcbcb;}
textarea::-moz-placeholder{ color:#cbcbcb;}
img{ max-width:100%; height:auto}

.m_only{ display:none !important}

/* 개인정보취급방침 (팝업)*/
#personal_info {}
#personal_info .popup_main .contents .title{ text-align:center; margin-bottom:30px;}
#personal_info .popup_main .contents .title span{ display:inline-block; font-size:24px; font-weight:bold; color:#333; text-align:center; padding-bottom:5px; border-bottom:2px solid #333;}
#personal_info .popup_main .contents .subTitle{ font-size:14px; font-weight:bold; color:#333; margin-top:30px; margin-bottom:10px;}
#personal_info .popup_main .contents .textBox{ width:100%; height:650px; overflow-y:scroll; padding-right:10px}
#personal_info .popup_main .contents .text01{ font-size:12px; color:#333; line-height:24px;}
#personal_info .popup_main .contents .text02{ font-size:12px; color:#333; line-height:24px;}

#terms{ position: relative; padding:200px 0}
#terms .xBtn{ position: absolute; top: 20px; right: 20px;}
#terms .xBtn img{ display: block; width: 20px;}
#terms .center{}
#terms .center .title{ text-align:center; margin-bottom:30px;}
#terms .center .title span{ display:inline-block; font-size:24px; font-weight:bold; color:#333; text-align:center; padding-bottom:5px; border-bottom:2px solid #333;}
#terms .center .subTitle{ font-size:14px; font-weight:bold; color:#333; margin-top:30px; margin-bottom:10px;}
#terms .center .textBox{ padding:40px; border:1px solid #ddd;}
#terms .center .text01{ font-size:14px; color:#333; line-height:24px;}
#terms .center .text02{ font-size:14px; color:#333; line-height:24px;}

/* Header */
header{ position:fixed; top:0; left:0; width:100%; max-width:354px; height: 100vh; z-index:11;}
header .container{ position: relative; height: 100%; padding: 20px; box-sizing:border-box;}
header .logo{ display: block; width:90px; height: 25px; background-image: url(/img_ggjd/logo.png); background-position: left center; background-repeat: no-repeat; background-size: contain;}
header nav{ position: absolute; top: 50%; left: 20px; transform: translateY(-50%); font-size: 0;}
header nav li{ margin: 20px 0;}
header nav li a{ font-size:14px; color: #5f5f5f; line-height: 1}
header nav li a:hover{ text-decoration: underline;}
header .bottomBox{ position: absolute; left: 20px; bottom: 20px;}
header .bottomBox .sns{}
header .bottomBox .sns a{ display: inline-block; vertical-align: middle; margin-right: 10px;}
header .bottomBox .sns a img{ display: block; width: 23px;}
header .bottomBox .info{ font-size:12px; color: #999; line-height: 1.2; margin-top: 15px}
header .bottomBox .info p{}
header .bottomBox .info .copyright{ margin-top: 15px;}

#main .visual{ width: 100%; height: 100vh; padding-left: 354px; box-sizing: border-box; overflow: hidden;}
#main .visual img{ display: block; width:100%; height: 100%; object-fit: cover; object-position: center; }
#rightText{ position: fixed; top: 50%; right: 20px; transform: translateY(-50%); z-index: 10; font-size:18px; font-weight: 400; color: #1f1f1f; line-height: 1.2;}
#bottomText{ display:none}

.subPage{}
.subPage .container{ padding-top: 150px; padding-left: 450px; padding-bottom: 150px; box-sizing: border-box;}
.subPage .center{ max-width: 1600px; padding-right: 100px; box-sizing: border-box}
#intro .intro_title{ font-size:22px; font-weight: bold; color: #1f1f1f; line-height: 1.4;}
#intro .intro_text{ font-size:16px; color: #1f1f1f; line-height: 1.8; margin-top: 60px;}
#intro .imgBox{ margin-top: 40px; }
#intro .imgBox img{ display: block; }
#intro .simbol{ text-align: right; margin-top: -45px; }
#intro .simbol img{ display: inline-block; width:35px; }
#process .process_title{ display: inline-block; vertical-align: top; width:400px; max-width: 100%; margin-top: -12px; margin-bottom: 50px}
#process .process_title img{ display: inline-block; vertical-align: middle; width:40px; margin-right: 10px; line-height: 1}
#process .process_title span{ display: inline-block; vertical-align: middle; font-size:22px; font-weight: bold; color: #1f1f1f;}
#process .process_textBox{ display: inline-block; vertical-align: top;}
#process .process_textBox li{ margin-bottom: 80px;}
#process .process_textBox li .process_subTitle{ font-size:18px; font-weight: bold; color: #1f1f1f;}
#process .process_textBox li .process_text{ font-size:16px; color: #1f1f1f; line-height: 1.8; margin-top: 8px;}
#request .mapBox{}
#request .mapBox #map{ height: 500px;}
#request .mapInfo{ font-size: 16px; color: #1f1f1f; line-height: 2; margin-top: 10px;}
#request .formBox{ position: relative; margin-top:100px;}
#request .formBox .request_title{}
#request .formBox .request_title img{ display: inline-block; vertical-align: middle; width:40px; margin-right: 10px; line-height: 1}
#request .formBox .request_title span{ display: inline-block; vertical-align: middle; font-size:22px; font-weight: bold; color: #1f1f1f;}
#request .formBox .form_list{ font-size: 0; margin-top: 40px; }
#request .formBox .form_list .flex-grow-1{ display: inline-block; vertical-align: top; width: 40%; font-size:0;}
#request .formBox .form_list .flex-grow-2{ display: inline-block; vertical-align: top; width: 60%; font-size:0}
#request .formBox .form_list .flex-grow-1 ul{ width:calc(100% - 100px); margin-left: 100px;}
#request .formBox .form_list .flex-grow-2 ul{ width:calc(50% - 50px);}
#request .formBox .form_list .flex-grow-2 ul:first-child{ margin-right:100px;}
#request .formBox .form_list2{ margin-top:0}
#request .formBox .form_list2 .flex-grow-2 ul{ width:100% !important;}
#request .formBox .form_list ul{ display: inline-block; vertical-align: top;}
#request .formBox .form_list ul li{ font-size:0; margin-bottom: 20px;}
#request .formBox .form_list ul li .form_title{ display: inline-block; vertical-align: top; width:100px; font-size: 16px; color: #1f1f1f; margin-top: 2px;}
#request .formBox .form_list ul li .form_title.wd100{ display:block; width:100%; margin-bottom: 10px;}
#request .formBox .form_list ul li .form_title span{ display: inline-block; vertical-align: super; color: #ef4e1b; margin-left: 2px;}
#request .formBox .form_list ul li .addressBox{ display: inline-block; vertical-align: middle; width:calc(100% - 100px); }
#request .formBox .form_list ul li .addressBox .inputBox{ display:block; width: 100%; margin-bottom: 20px}
#request .formBox .form_list ul li .addressBox .inputBox:last-of-type{ margin-bottom:0}
#request .formBox .form_list ul li .inputBox{ position: relative; display: inline-block; vertical-align: middle; width:calc(100% - 100px); height: 30px; border-bottom: 1px solid #1f1f1f; box-sizing: border-box}
#request .formBox .form_list ul li .inputBox.phone1{ width:25px; border-bottom:none; }
#request .formBox .form_list ul li .inputBox.phone1 input{ color: #1f1f1f;}
#request .formBox .form_list ul li .inputBox.phone2,
#request .formBox .form_list ul li .inputBox.phone3{ width:calc(50% - 103px);}
#request .formBox .form_list ul li .inputBox input{ display: block; width:100%; height: 100%; border: none; background-color: transparent; outline: none; font-size: 14px; color: #1f1f1f; padding: 0;}
#request .formBox .form_list ul li .inputBox.unit_won:after{ content: "만원"; position: absolute; bottom: 5px; right: 0; font-size: 14px; color: #1f1f1f; z-index: 1}
#request .formBox .form_list ul li .inputBox.unit_py:after{ content: "평"; position: absolute; bottom: 5px; right: 0; font-size: 14px; color: #1f1f1f; z-index: 1}
#request .formBox .form_list ul li .dash{ display: inline-block; vertical-align: middle; width:40px; font-size: 13px; color: #1f1f1f; text-align: center;}
#request .formBox .form_list ul li .radioBox{ display: inline-block; vertical-align: middle;}
#request .formBox .form_list ul li .radioBox input{ display: none;}
#request .formBox .form_list ul li .radioBox input + label{ display: inline-block; vertical-align: middle; font-size:16px; color: #5f5f5f; line-height: 1.6; padding-left: 20px; background-image: url("/img_ggjd/check_off.png"); background-position: left center; background-repeat: no-repeat; background-size: 16px; margin-right: 30px; cursor: pointer}
#request .formBox .form_list ul li .radioBox input + label:last-of-type{ margin-right:0;}
#request .formBox .form_list ul li .radioBox input:checked + label{ background-image: url("/img_ggjd/check_on.png"); }
#request .formBox .form_list ul li.py .form_title{ width:60px;}
#request .formBox .form_list ul li.py .inputBox{ width:calc(100% - 222px); margin-left: 30px;}
#request .formBox .form_list ul li .textArea{ display: block; width:100%; height: 150px; border: 1px solid #1f1f1f; box-sizing: border-box; margin-top: 10px;}
#request .formBox .form_list ul li .textArea textArea{ display: block; width:100%; height: 100%; border: none; background-color: transparent; outline: none; font-size: 14px; color: #1f1f1f; padding: 10px; box-sizing: border-box; resize: none;}
#request .formBox .form_list ul li .img_list{ display: inline-block; vertical-align: middle;}
#request .formBox .form_list ul li .img_list .imgBox{ position: relative; display: inline-block; vertical-align: middle; width: 80px; height: 80px; border: 1px solid #1f1f1f; box-sizing: border-box; text-align: center; margin-right: 10px;}
#request .formBox .form_list ul li .img_list .imgBox > img{ display: block; width: 100%; height: 100%; }
#request .formBox .form_list ul li .img_list .imgBox .img_delete{ position: absolute; top: 2px; right: 2px; display: block; padding: 4px 4px 5px; border-radius: 50%; background-color: rgba(0, 0, 0, 0.5); z-index: 2;}
#request .formBox .form_list ul li .img_list .imgBox .img_delete img{ display: block; width: 7px;}
#request .formBox .form_list ul li .uploadBox{ display: inline-block; vertical-align: middle;}
#request .formBox .form_list ul li .uploadBox input{ display: none}
#request .formBox .form_list ul li .uploadBox label{ display: inline-block; vertical-align: middle; width: 80px; height: 80px; border: 1px solid #1f1f1f; box-sizing: border-box; background-image: url("/img_ggjd/menu_plus.svg"); background-position: center; background-repeat: no-repeat; background-size: 25px; cursor: pointer;}
#request .formBox .agreeBox{ margin-top: 40px;}
#request .formBox .agreeBox img{ display: inline-block; vertical-align: middle; width: 16px;}
#request .formBox .agreeBox .agreeBtn{ display: inline-block; vertical-align: middle; font-size: 16px; font-weight: 500; color: #1f1f1f; border-bottom: 1px solid #1f1f1f;}
#request .formBox .agreeBox span{ display: inline-block; vertical-align: middle; font-size: 16px; color: #1f1f1f;}
#request .formBox .requestBtn{ position: absolute; bottom: 0; right: 0; display: flex; justify-content: center; align-items: center; width: 180px; height: 45px; font-size: 16px; color: #fff; background-color: #1f1f1f;}

#bo_gall{ padding-right:20px; box-sizing: border-box;}
#bo_gall #gall_ul{ column-count: 2; column-gap: 24px; list-style: none;	margin: 0; padding: 0; overflow: hidden; }
#bo_gall #gall_ul .gall_li{display: inline-block; width: 100%; margin: 0 0 24px 0; break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid;}
#bo_gall #gall_ul .gall_li .gall_box{ display: block;}
#bo_gall #gall_ul .gall_li .gall_box img{ display: block; width:100%;}
#bo_gall #gall_ul .empty_list{ display: block; width: 100%; text-align: center; color: #999;}
#portfolio_view .subject{ font-size:22px; font-weight:bold; color:#1f1f1f;}
#portfolio_view .info{ font-size:16px; color:#5f5f5f; margin-top:20px;}
#portfolio_view .contents{}
#portfolio_view .contents li{ margin-top:80px; overflow:hidden;}
#portfolio_view .contents li .textBox{ font-size:16px; color:#5f5f5f; line-height:1.8;}
#portfolio_view .contents li .imgBox{ width:auto; height:auto; max-width:100%; max-height:100%;}
#portfolio_view .contents li .imgBox img{ display:block; max-width:100%;}
#portfolio_view .contents li > .imgBox img{ height:800px;}
#portfolio_view .contents li .swiperBox{}
#portfolio_view .contents li .swiperBox .swiper-slide{ width:auto; height:800px;}
#portfolio_view .contents li .swiperBox .swiper-slide .textBox{ width:300px; height:inherit; overflow:auto;}
#portfolio_view .contents li .swiperBox .swiper-slide .imgBox{ height:inherit;}
#portfolio_view .contents li .swiperBox .swiper-slide .imgBox img{ max-width:100%; max-height:100%;}
#portfolio_view .board_btn{ text-align:right; margin-top:40px;}
#portfolio_view .board_btn a{ border:1px solid #ccc; padding:7px 12px; background:transparent; color:#838383 !important; font-size:14px;}
#portfolio_w #container_title{ margin-bottom:20px; text-align:center;}
#portfolio_w .tbl_frm01{ width:100%; padding:20px; box-sizing:border-box; border-radius:10px; border:1px solid #ddd; box-shadow:0 2px 4px 0 rgba(234,235,239,.8)}
#portfolio_w .tbl_frm01 table{ border:none;}
#portfolio_w .tbl_frm01 table th{ width:120px; border:none; background-color:transparent; font-size:15px; font-weight:bold; color:#333; text-align:left; padding:5px 10px;}
#portfolio_w .tbl_frm01 table td{ width:auto; border:none; color:#888;}
#portfolio_w .tbl_frm01 table td input[type=text]{ width:100%; border-radius:5px; box-shadow:none; font-size:14px; color:#888; padding-left:10px; box-sizing:border-box}
#portfolio_w .tbl_frm01 table td input[type=file]{ padding:0; height:auto; border:none; box-shadow:none}
#portfolio_w .tbl_frm01 table td.damdang input{ width:100px; border:none; border-bottom:1px solid #ddd; border-radius:0}
#portfolio_w .tbl_frm01 table td select{ width:100%; border-radius:5px; font-size:14px; color:#888; padding-left:5px; box-sizing:border-box;}
#portfolio_w .tbl_frm01 table td .thumb_img{ position:relative; display:inline-block; margin-top:10px;}
#portfolio_w .tbl_frm01 table td .thumb_img > img{ max-width:300px}
#portfolio_w .tbl_frm01 table td .thumb_img .delBtn{ position:absolute; top:5px; right:5px; display:block;}
#portfolio_w .tbl_frm01 table td .thumb_img .delBtn img{ width:18px;}
#portfolio_w .port_contents > li{ position:relative; margin-bottom:40px; border:1px solid #ddd;}
#portfolio_w .port_contents > li .addBtn{ border-bottom:1px solid #ddd; padding:10px;}
#portfolio_w .port_contents > li .addBtn label{ display:inline-block; margin-right:8px;}
#portfolio_w .port_contents > li .addBtn label input{ display:none;}
#portfolio_w .port_contents > li .addBtn label span{ display:inline-block; padding:5px 10px; font-size:12px; border:1px solid #000;}
#portfolio_w .port_contents > li .addBtn label input:checked + span{ color:#fff; background:#000;}
#portfolio_w .port_contents > li .cont_editor{ padding:10px;}
#portfolio_w .port_contents > li .cont_editor .textBox{ position:relative; border:1px solid #ddd; width:100%; margin-bottom:10px;}
#portfolio_w .port_contents > li .cont_editor .textBox textarea{ width:100%; min-height:150px; font-size:14px; padding:10px; border:none; background:transparent; resize:none; white-space:pre-wrap;}
#portfolio_w .port_contents > li .cont_editor .textBox .delBtn{ position:absolute; top:5px; right:5px;}
#portfolio_w .port_contents > li .cont_editor .textBox .delBtn img{ width:18px;}
#portfolio_w .port_contents > li .cont_editor .imgBox{ border:1px solid #ddd; padding:10px;}
#portfolio_w .port_contents > li .cont_editor .imgBox input{ font-size:14px;}
#portfolio_w .port_contents > li .cont_editor .imgBox .thumb_list{ margin-top:10px;}
#portfolio_w .port_contents > li .cont_editor .imgBox .thumb_list li{ position:relative; display:inline-block; vertical-align:middle; max-width:300px; height:200px; margin-right:10px; margin-top:10px; cursor:move;}
#portfolio_w .port_contents > li .cont_editor .imgBox .thumb_list li > img{ display:block; max-height:100%;}
#portfolio_w .port_contents > li .cont_editor .imgBox .thumb_list li .img_del{ position:absolute; top:5px; right:5px; display:block;}
#portfolio_w .port_contents > li .cont_editor .imgBox .thumb_list li .img_del img{ width:18px;}
#portfolio_w .port_contents > li .cont_editor.both{ font-size:0}
#portfolio_w .port_contents > li .cont_editor.both .textBox{ display:inline-block; vertical-align:top; width:300px; margin-right:20px;}
#portfolio_w .port_contents > li .cont_editor.both .imgBox{ display:inline-block; vertical-align:top; width:calc(100% - 320px);}
#portfolio_w .port_contents > li .liDelBtn{ position:absolute; top:-10px; right:-10px; display:block;}
#portfolio_w .port_contents > li .liDelBtn img{ width:25px;}
#portfolio_w .btn_confirm{ padding-top:20px; margin-top:20px; text-align:center; border-top:1px solid #ddd;}
#portfolio_w .btn_confirm .btn_submit{ display:inline-block; vertical-align:middle; width:100px; line-height:40px; font-size:14px; color:#fff; text-align:center; background-color:#333; margin-right:5px;}
#portfolio_w .btn_confirm .btn_cancel{ display:inline-block; vertical-align:middle; width:100px; line-height:40px; font-size:14px; color:#fff; text-align:center; background-color:#888}
#portfolio_w .port_contents .contBox{position:relative}
#portfolio_w .port_contents .contBox .dragHandle{ position:absolute;left:-12px;top:8px;width:8px;height:22px;cursor:move;opacity:.7; background:linear-gradient(transparent 6px,#bbb 6px,#bbb 8px,transparent 8px) left top/8px 14px no-repeat, linear-gradient(transparent 0,#bbb 0,#bbb 2px,transparent 2px) left bottom/8px 8px no-repeat;}
#port_contents.sorting .contBox{opacity:.9}
#portfolio_w .port_contents .cont-placeholder{box-sizing:border-box;border:2px dashed #c7c7c7;background:#fafafa;height:80px;margin:10px 0}

@keyframes fadeInOut {
	0% {opacity:0;}
	50% {opacity:1;}
	100% {opacity:0;}
}


@media (max-width:1920px){
	header{ max-width:320px;}
	#main .visual { padding-left: 320px;}
	#request .formBox .form_list .flex-grow-1 ul{ width:calc(100% - 60px); margin-left: 60px;}
	#request .formBox .form_list .flex-grow-2 ul{ width:calc(50% - 30px);}
	#request .formBox .form_list .flex-grow-2 ul:first-child{ margin-right:60px;}
	#request .formBox .form_list ul li .radioBox input + label{ margin-right:20px}
	#request .formBox .form_list ul li.py .inputBox{margin-left: 20px;}
}

@media (max-width:1600px){	
	
}

@media (max-width:1400px){
	.subPage .container{ padding-left:300px;}
	#portfolio_view .contents li .swiperBox .swiper-slide{ height:600px; margin-right: 20px !important}
	#portfolio_view .contents li > .imgBox img{ height:600px;}
	
}

@media (max-width:1240px){
	#request .formBox .form_list .flex-grow-1,
	#request .formBox .form_list .flex-grow-2{ display: block; width:100%;}
	#request .formBox .form_list .flex-grow-1 ul{ width:100%; margin-left:0}
	#request .formBox .form_list .flex-grow-2 ul{ width:100%;}
	#request .formBox .form_list .flex-grow-2 ul:first-child{ margin-right:60px;}
	#request .formBox .form_list ul li.py .form_title{ width:100px;}
	#request .formBox .form_list ul li.py .inputBox{ width: calc(100% - 242px);}
}

@media (max-width:1024px){
	header{ max-width:220px;}
	#main .visual { padding-left: 220px;}
	.subPage .container{ padding-left:220px;}
	
}
@media (min-width:769px){
	header .container{ display:block !important}
}
@media (max-width:768px){
	.m_only{ display:block !important}
	.pc_only{ display:none !important}
	
	#personal_info{ width:96%; height:98%}
	#personal_info .pop-container{ padding:20px 10px}
	#personal_info .popup_main .contents .title span{ font-size:20px;}
	#personal_info .popup_main .contents .textBox{ padding:0; height:calc(100vh - 150px);}
	#terms{ padding:50px 0; box-sizing:border-box}
	#terms .center .title span{ font-size:18px;}
	#terms .center .textBox{ padding:20px;}
	#terms .center .text01{ font-size:12px;}
	#terms .center .text02{ font-size:12px;}
	
	header{ position: fixed; top: 0; left: 0; width: 100%; max-width: 100%; height: auto; background-color: #fff; padding: 20px; box-sizing: border-box; z-index: 10000}
	header .container{ display:none; position:fixed; top: 0; left: 0; width:100%; height: 100vh; background-color: #fff; z-index: 100; text-align: center;}
	header .container .menu_close{ position: absolute; top: 22px; right: 20px; z-index: 1;}
	header .container .menu_close img{ display: block; width:22px;}
	header .container .logo{ display: inline-block;}
	header .logo_m{ width: 90px; height: 25px; background-image: url(/img_ggjd/logo.png); background-position: left center; background-repeat: no-repeat; background-size: contain;}
	header .menu{ position: absolute; top: 50%; transform: translateY(-50%); right: 20px; display: block; width:22px; height: 22px; background-image: url("/img_ggjd/menu_plus.svg"); background-position: center; background-repeat: no-repeat; background-size: contain; z-index: 1;}
	header .menu img{ }
	header nav{ left:0; width: 100%; text-align: center;}
	header nav li{ margin:30px 0;}
	header nav li a{ font-size:16px; color:#1f1f1f;}
	header .bottomBox{ left:0; width: 100%; text-align: center;}
	header .bottomBox .sns a{ margin:0 7px;}
	header .bottomBox .sns a img{ width:28px}
	header .bottomBox .info{ font-size:12px; margin-top: 20px;}
	#bottomText{ position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); font-size:14px; color: #fff; }
	#main .visual { padding-left: 0;}
	
	.subPage .container{ padding:150px 20px 100px;}
	.subPage .center{ width:100%; padding-right: 0}
	#intro .simbol{ margin-top:40px; text-align: left;}
	#intro .intro_title{ font-size:20px;}
	#intro .intro_text{ font-size:14px; margin-top:40px}
	#intro .imgBox{ margin-top:30px}
	#process .process_title img,
	#request .formBox .request_title img{ width:35px;}
	#process .process_title span,
	#request .formBox .request_title span{ font-size:20px;}
	#process .process_textBox li{ margin-bottom:50px;}
	#process .process_textBox li .process_subTitle{ font-size:16px;}
	#process .process_textBox li .process_text{ font-size:14px;}
	#request .mapBox #map{ height:250px}
	#request .mapInfo{ font-size:13px; letter-spacing: -0.03em;}
	#request .formBox{ margin-top:60px;}
	#request .formBox .form_list ul li .form_title{ width:90px; font-size:14px;}
	#request .formBox .form_list ul li .inputBox{ width: calc(100% - 90px);}
	#request .formBox .form_list ul li.py .form_title{ width:50px;}
	#request .formBox .form_list ul li.py .inputBox{ width: calc(100% - 184px);}
	#request .formBox .form_list ul li .radioBox input + label{ font-size:14px; background-size: 14px;}
	#request .formBox .form_list ul li .textArea{ height:120px;}
	#request .formBox .form_list ul li .uploadBox label{ width:60px; height: 60px; background-size: 20px;}
	#request .formBox .form_list ul li .img_list .imgBox{ width: 60px; height: 60px;}
	#request .formBox .form_list ul li .addressBox{ width: calc(100% - 90px);}
	#request .formBox .form_list ul li .inputBox.phone2, 
	#request .formBox .form_list ul li .inputBox.phone3{ width: calc(50% - 98px);}
	#request .formBox .form_list .flex-grow-2 ul:first-child{ margin-right:0}
	#request .formBox .agreeBox{ margin-top:10px}
	#request .formBox .agreeBox img{ width:14px;}
	#request .formBox .agreeBox .agreeBtn,
	#request .formBox .agreeBox span{ font-size:14px;}
	#request .formBox .requestBtn{ position:static; width:100%; height: 40px; font-size:14px; font-weight: bold; margin-top:40px;}
	
	#bo_gall{ padding:0}
	#bo_gall #gall_ul{ column-count: 1; column-gap: 16px; }
	#bo_gall #gall_ul .gall_li{ margin-bottom: 16px; }
	#portfolio_view .subject{ font-size:20px;}
	#portfolio_view .info{ font-size:14px;}
	#portfolio_view .contents li .textBox{ font-size:14px;}
	#portfolio_view .contents li{ margin-top:40px;}
	#portfolio_view .contents li .swiperBox .swiper-slide{ height:55vw; margin-right: 10px !important}
	#portfolio_view .contents li .swiperBox .swiper-slide .textBox{ width:60vw;}
	#portfolio_view .contents li > .imgBox img{ height:auto;}
	#portfolio_w .tbl_frm01 table td .thumb_img{ width:100%;}
	#portfolio_w .tbl_frm01 table td .thumb_img > img{ width:100%;}
	#portfolio_w .port_contents > li .cont_editor .imgBox .thumb_list li{ height:100px}
	
}

@keyframes moving {
	0% { left: 0;}
	50% { left: -50%;}
	100% { left: 0;}
}