@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700&display=swap&subset=korean');
@import url('https://fonts.googleapis.com/css?family=Montserrat:100&display=swap');


@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Muli-Regular.eot'); /* IE9 Compat Modes */
  src: local('Muli-Regular Regular'), local('Muli-Regular'),
       url('../fonts/Muli-Regular.otf') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/Muli-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/Muli-Regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/Muli-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/Muli-Regular.svg') format('svg'); /* Legacy iOS */
}


@font-face {
  font-family: 'Muli';
  font-style: bold;
  font-weight: 700;
  src: url('../fonts/Muli-Bold.eot'); /* IE9 Compat Modes */
  src: local('Muli-Bold Regular'), local('Muli-Bold'),
       url('../fonts/Muli-Bold.otf') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/Muli-Bold.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/Muli-Bold.woff') format('woff'), /* Modern Browsers */
       url('../fonts/Muli-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/Muli-Bold.svg') format('svg'); /* Legacy iOS */
}



/* common */
html, body {position: relative; margin: 0; width: 100%; height: 100%; font-size: 16px;}
* {margin: 0; padding: 0; list-style: none; text-decoration: none; font-family: 'Noto Sans KR', 'Muli', 'Montserrat', 'sans-serif'; color: inherit; outline: none; -webkit-text-size-adjust: none;}
ul > li > a {text-decoration: none;}
a {color: inherit;}
a:link { text-decoration:none ;outline: none; }
a:visited { text-decoration:none ; outline: none;}
a:active { text-decoration:none ; outline: none;}
a:hover { text-decoration:none; outline: none;}

table { border-collapse: collapse; }
.blind {position:absolute !important;visibility:hidden !important;top:0 !important;left:0 !important;height:0 !important;width:0 !important;font-size:0 !important;line-height:0 !important; overflow:hidden !important;}
em {font-style: normal;}
p, strong, em, span {white-space: pre-line; word-break: keep-all; letter-spacing: -0.5px;}
fieldset {border:none;}
legend {display:none !important;}
caption {display:none;}
i {display: inline-block;}
strong {font-weight:600;}
input {box-sizing: border-box;}
input[type="text"] {border-radius: 0;}
input[type="text"]::-ms-clear {display: none;}
button {box-sizing: border-box; border: 0; background-color: transparent; cursor: pointer;}
textarea {box-sizing: border-box; border-radius: 0; resize: none; -moz-appearance: none; -webkit-appearance: none; appearance: none;}
select {-webkit-border-radius: 0; -moz-appearance: none; -webkit-appearance: none; appearance: none; box-sizing: border-box; cursor: pointer;}
select::-ms-expand {display: none;} /* IE 10, 11의 네이티브 화살표 숨기기 */


/* LAYOUT */
#A_Wrap {width: 100%;}
#A_Container_Wrap {position: relative; width: 100%;}
#A_Container {width: 100%;}
#A_Container:after {display: block; clear: both; *zoom: 1; content: '';}
.inner {box-sizing: border-box; width: 100%; margin: 0 auto; padding: 0 60px;}


/* icons */
.ic_down {width: 19px; height: 19px; background: url(../images/common/ic_down.svg) no-repeat 0 0;}
.ic_blog {width: 14px; height: 17px; vertical-align: middle;}
.ic_blog path {transition: fill 0.5s ease-in-out;}
.ic_facebook {width: 10px; height: 20px; vertical-align: middle;}
.ic_facebook path {transition: fill 0.5s ease-in-out;}


/* header */
#A_Header {position: fixed; top: 0; left: 0; right: 0; width: 100%; margin: 0 auto; z-index: 99;}
#A_Header .logo {display: block; position: absolute; left: 60px; z-index: 11;}
#A_Header .logo a {display: block; width: 100%; height: 100%; text-indent: -9999px; background-size:100% 100%;}
.main_header .logo {top: 55px; width: 137px; height: 23px; opacity: 0.5; transition: all 0.5s ease-in-out;}
.main_header .logo a {background: url(../images/common/logo_avandesign.png) no-repeat 0 0;}
.main_menu {position: absolute; top: 40px; right:200px; transition: all 0.5s ease-in-out;}
.main_menu li {float: left; margin: 0 0 0 45px;}
.main_menu li:first-child {margin: 0;}
.main_menu li a {display: block; line-height: 60px; font-family: 'Muli'; font-size: 1rem; font-weight: 400; color: #fff;}

.sub_header .main_menu {display:none;}

.top_fot {position: absolute; top: 55px; right:114px;}
.top_fot a {display:inline-block;/* width:114px;*/ width:150px; height:38px; line-height:38px; font-size:16px; font-weight:500; color:#fff; text-align:center; background:#008beb;}
.menu {position: absolute; top: 55px; right: 60px; z-index: 11; transition: all 0.5s ease-in-out;}
.menubar {width: 35px; height: 16px; cursor: pointer; z-index: 90;}
.menubar li {position: absolute; width: 100%; height: 2px; background-color: #fff;}
.menubar li:nth-child(1) {top: 0; left: 0; right: 0; margin: 0 auto;}
.menubar li:nth-child(2) {animation:repeat 0.5s 1s infinite alternate; top: 7px; /*width: 16px;*/ transition: all 0.3s ease-in-out;}
/*.menubar:hover li:nth-child(2) {width: 100%;}*/
.menubar li:nth-child(3) {top: 14px; left: 0; right: 0; margin: 0 auto;}
.menu p {margin: 5px 0 0 0; font-size: 0.75rem; color: #fff;}

@keyframes repeat {
    from {width: 16px;}
    to {width: 100%;}
}

.gnbWrap {display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; margin: 0 auto; background: #2a2a2d url(../images/common/menu_bg.png) no-repeat center center / cover; z-index: 10;}
.gnbWrap .gnb_inner {position: absolute; top: 50%; transform: translateY(-50%); right: -1545px; width: 1545px; height: 700px;}
.gnbWrap .com_info {position: absolute; top: 50%; transform: translateY(-50%); left: 0; float: left; width: 600px; padding: 70px 0; border-top: 1px solid rgba(255, 255, 255, 0.5); border-bottom: 1px solid rgba(255, 255, 255, 0.5); transition: all 0.5s ease-in-out;}
.gnbWrap .com_info li {margin: 35px 0 0 0;}
.gnbWrap .com_info li:first-child {margin: 0;}
.gnbWrap .com_info li strong {display: block; font-size: 1.625rem; color: #fff;}
.gnbWrap .com_info li p {font-size: 1.25rem; font-weight: 300; color: #fff; opacity: 0.5; transition: all 0.5s ease-in-out;}
.gnbWrap .gnb {position: absolute; top: 50%; transform: translateY(-50%); right: 0; box-sizing: border-box; width: 825px; padding: 5% 0 5% 120px; background-color: #fff; transition: all 0.5s ease-in-out;}
.gnbWrap .gnb li a {display: block; line-height: 80px; font-family: 'Muli', 'Noto Sans KR'; font-size: 2.5rem; font-weight: 700; color: #333; transition: all 0.5s ease-in-out;}
.gnbWrap .gnb li a .num {display: inline-block; position: relative; width: 92px; margin: 0 30px 0 0; font-family: 'Montserrat'; font-size: 3.125rem; font-weight: 100; color: #333; vertical-align: top;}
.gnbWrap .gnb li a .num:before {display: block; position: absolute; top: 50%; transform: translateY(-50%) rotate(-45deg); right: 0; width: 1px; height: 20px; background-color: #666; content: '';}
.gnbWrap .gnb li a:hover {color: #20aaff;}
.gnbWrap .ft_util {display: none;}


.sub_header {height: 140px; transition: all 0.5s ease-in-out;}
.sub_header .logo {top: 60px; width: 137px; height: 23px; transition: all 0.5s ease-in-out;}
.sub_header .logo a {background: url(../images/common/logo_avandesign.png) no-repeat 0 0;}
.sub_header .menu {display: none;}
.sub_header .top_fot {display: none;}
.sub_menu {position: absolute; top: 40px; right: 250px; transition: all 0.5s ease-in-out;}
.sub_menu li {float: left; margin: 0 0 0 45px;}
.sub_menu li:first-child {margin: 0;}
.sub_menu li a {display: block; line-height: 60px; font-family: 'Muli'; font-size: 1rem; font-weight: 400; color: #fff;}
.sub_menu li.active a {color: #999;}
.sub_sns {position: absolute; top: 40px; right: 60px; border: 1px solid rgba(255, 255, 255, 0.5); transition: all 0.5s ease-in-out;}
.sub_sns li {float: left; box-sizing: border-box;}
.sub_sns li:first-child {border-right: 1px solid rgba(255, 255, 255, 0.5);}
.sub_sns li a {display: block; height: 60px; line-height: 60px; padding: 0 25px 0 28px; color: #fff; opacity: 0.5; transition: opacity 0.5s ease-in-out;}
.sub_sns li a:hover {opacity: 1;}
.sub_sns li a p {height: 0; font-size: 0; text-indent: -9999px;}
.sub_sns li a:hover .ic_blog path {fill: #00c73c;}
.sub_sns li a:hover .ic_facebook path {fill: #3b5998;}
/*.sub_sns li a i {vertical-align: sub;}*/
/*.sub_sns li a .ic_blog {background: url(../images/common/ic_blog_gray.svg) no-repeat 0 0;}*/
/*.sub_sns li a .ic_facebook {background: url(../images/common/ic_facebook_gray.svg) no-repeat 0 0;}*/

.sub_header.indicator {height: 60px; background-color: #fff; border-bottom: 1px solid #ddd;}
.sub_header.indicator .logo {top: 50%; transform: translateY(-50%);}
.sub_header.indicator .logo a {background: url(../images/common/logo_avandesign_bk.png) no-repeat 0 0;}
.sub_header.indicator .sub_menu {top: 0;}
.sub_header.indicator .sub_menu li a {position: relative; color: #333;}
.sub_header.indicator .sub_menu li a:before {visibility: hidden; opacity: 0; position: absolute; left: 0; right: 0; bottom: 10px; margin: 0 auto; width: 0; height: 1px; background-color: #0090e8; content: ''; transition: all 0.5s ease-in-out;}
.sub_header.indicator .sub_menu li.active a {color: #999;}
.sub_header.indicator .sub_menu li a:hover:before {visibility: visible; opacity: 1; width: 30px;}

.sub_header.indicator .sub_sns {top: 0; border-color: #ddd; border-top: 0; border-bottom: 0;}
.sub_header.indicator .sub_sns li:first-child {border-color: #ddd;}
.sub_header.indicator .sub_sns li .ic_blog path {fill: #bbbbbb;}
.sub_header.indicator .sub_sns li .ic_facebook path {fill: #bbbbbb;}
.sub_header.indicator .sub_sns li a:hover .ic_blog path {fill: #00c73c;}
.sub_header.indicator .sub_sns li a:hover .ic_facebook path {fill: #3b5998;}
.sub_header.indicator .menu li {background-color: #333;}


.project_header {height: 60px; background-color: #fff; border-bottom: 1px solid #ddd;}
.project_header .logo {top: 50%; transform: translateY(-50%); width: 120px; height: 20px;}
.project_header .logo a {background: url(../images/common/logo_blue.svg) no-repeat 0 0;}
.project_header.active .logo a {opacity: 0.5; background: url(../images/common/logo.svg) no-repeat 0 0;}
.project_header .sub_menu {top: 0;}
.project_header .top_fot {display: none;}
.project_header .sub_menu li a {position: relative; color: #333;}
.project_header .sub_menu li a:before {visibility: hidden; opacity: 0; position: absolute; left: 0; right: 0; bottom: 10px; margin: 0 auto; width: 0; height: 1px; background-color: #0090e8; content: ''; transition: all 0.5s ease-in-out;}
.project_header .sub_menu li.active a {color: #999;}
.project_header .sub_menu li a:hover:before {visibility: visible; opacity: 1; width: 30px;}

.project_header .sub_sns {top: 0; border-color: #ddd; border-top: 0; border-bottom: 0;}
.project_header .sub_sns li:first-child {border-color: #ddd;}
.project_header .sub_sns .ic_blog path {fill: #bbbbbb;}
.project_header .sub_sns .ic_facebook path {fill: #bbbbbb;}
.project_header .menu {display: none;}
.project_header .menu li {background-color: #333;}






/* footer */

.main_footer {position: fixed; bottom: 40px; left: 0; right: 0; width: 100%; margin: 0 auto; z-index: 10;}
.main_footer .copy {font-size: 1rem; color: rgba(255, 255, 255, 0.5); text-align: center; transition: all 0.5s ease-in-out;}
.ft_wrap {position: absolute; right: 60px; bottom: 0; width: 594px;}
.ft_util {float: left;}
.ft_util li {float: left; position: relative;}
.ft_util li:before {display: block; position: absolute; top: 22px; left: 0; width: 1px; height: 11px; background-color: rgba(255, 255, 255, 0.5); content: '';}
.ft_util li:first-child:before {display: none;}
.ft_util li a {display: block; height: 50px; line-height: 50px; padding: 0 25px 0 28px; color: #fff; opacity: 0.5; transition: opacity 0.5s ease-in-out;}
.ft_util li a:hover {opacity: 1;}
.ft_util li a p {height: 0; font-size: 0; text-indent: -9999px;}
.ft_util li a i {vertical-align: sub;}
.ft_util li a .ic_down {margin: 0 0 0 10px;}
.ft_util li a:hover .ic_blog path {fill: #00c73c;}
.ft_util li a:hover .ic_facebook path {fill: #3b5998;}

.quick_wrap {position: relative; float: left; width: 300px; height: 50px;}
.quick_wrap ul {width: 100%; height: 50px; display:block !important;}
.quick_wrap ul li {float: left; /*cursor: pointer;*/}
.quick_wrap .call {overflow: hidden; box-sizing: border-box; width: 50px; height: 50px; text-align: center; border: 1px solid #fff; background: transparent; opacity: 0.5; transition: all 0.5s ease-in-out; cursor:pointer;}
/*.quick_wrap .call:hover {opacity: 1;}
.quick_wrap .call:hover + .quick_btn {background-color: transparent; border: 1px solid #fff;}
.quick_wrap .call div {padding: 0 10px;} */
.quick_wrap .call i {width: 27px; height: 50px; background: url(../images/common/ic_call.svg) no-repeat center center;}
.quick_wrap .quick_btn {box-sizing: border-box; width: 240px; height: 110px; margin: 0 0 0 10px; line-height: 48px; font-size: 1.125rem; color: #fff; text-align: center; border-radius: 0 25px 0 0; border: 1px solid #D92C2C; background-color: #D92C2C; transition: all 0.5s ease-in-out;position: relative;bottom: 60px;}
.quick_wrap .quick_btn p{font-size: 1.125rem;margin-top: 2px;position: relative;top:10px;}
.quick_wrap .quick_btn p span{font-size: 24px;font-weight: bold;}
.quick_wrap .quick_btn a {display:inline-block; width:100%; height:100%;}
.quick_open {visibility: hidden; opacity: 0; position: absolute; bottom: -326px; right: 0; transition: all 0.5s ease-in-out; z-index: 1;}
.quick_write {position: relative; display: block; box-sizing: border-box; margin: 0 0 10px 0; width: 300px; padding: 20px; border-radius: 0 25px 0 0; background-color: rgba(0, 0, 0, 0.75);}
.quick_write strong {display: block; margin: 0 0 15px 0; font-size: 1.125rem; color: #fff;}
.quick_write input {margin: 0 0 10px 0; width: 100%; padding: 0 20px; height: 40px; font-size: 1rem; color: #fff; background-color: transparent; border: 1px solid rgba(255, 255, 255, 0.5); -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.quick_write textarea {width: 100%; height: 100px; padding: 20px; font-size: 1rem; color: #fff; background-color: transparent; border: 1px solid rgba(255, 255, 255, 0.5);}
.quick_write .btn_inquiry {margin: 20px 0 0 0; width: 100%; height: 40px; font-size: 1rem; font-weight: 500; color: #fff; background-color: #20aaff; text-align: center;}
.quick_write .btn_close {position: absolute; top: 20px; right: 20px; width: 16px; height: 16px; text-indent: -9999px; background: url(../images/main/ic_close.png) no-repeat 0 0;}


.chk_box input[type="checkbox"] {display: none;}
.chk_box input[type="checkbox"] + label {font-size: 0.875rem; color: #999; cursor: pointer; vertical-align: middle;}
.chk_box input[type="checkbox"] + label span {display: inline-block; width: 20px; height: 20px; margin-right: 10px; vertical-align: sub; background: url(../images/main/chk_off.png) center no-repeat; cursor: pointer;}
.chk_box input[type="checkbox"]:checked + label span {background:url(../images/main/chk_on.png) center no-repeat;}
.chk_box a {font-size: 0.875rem; color: #999; margin-left:10px; border-bottom:1px solid #999;}

.call_number {width: 300px; height: 50px; background: rgba(0, 0, 0, 0.75); text-align: center;}
.call_number i {width: 27px; height: 50px; background: url(../images/common/ic_call.svg) no-repeat center center;}
.call_number p {display: inline-block; padding: 0 0 0 10px; line-height: 50px; font-size: 1.25rem; font-weight: 500; color: #fff; text-align: center; vertical-align: top;}
.call_number a {display: inline-block; padding: 0 0 0 10px; line-height: 50px; font-size: 1.25rem; font-weight: 500; color: #fff; text-align: center; vertical-align: top;}

.sub_footer {position: relative; overflow: hidden;}
.sub_footer .inner {position: relative; width: 1410px; margin: 0 auto; padding: 50px 0;}
.sub_footer .inner:after {display: block; clear: both; *zoom: 1; content: '';}
.sub_footer .quick_wrap {display:none; position: fixed; bottom: 0; right: 60px; float: none;}
.sub_footer .quick_wrap .call {border: 0; background-color: #000;}
.sub_footer .quick_wrap .call:hover + .quick_btn {background-color: transparent; border: 1px solid #20aaff; color: #20aaff;}
.sub_footer .quick_write {background-color: rgba(0, 0, 0, 0.75);}
.sub_footer .call_number {background-color: rgba(0, 0, 0, 0.75);}
.sub_footer .ft_bnn {background: url(../images/sub/ft_bnn_bg.jpg) no-repeat center 0 / cover;}
.sub_footer .ft_bnn .inner {padding: 50px 0 60px; color: #fff;}
.sub_footer .ft_bnn .txt_box p {display: inline-block; font-size: 1.25rem; font-weight: 300; border-bottom: 1px solid #fff; opacity: 0.6;}
.sub_footer .ft_bnn .txt_box strong {display: block; margin: 50px 0 0 0; font-size: 3.75rem; font-weight: 300;}
.sub_footer .ft_bnn .btn_go {position: absolute; bottom: 60px; right: 0; display: block; width: 61px; height: 20px; font-family: 'Muli'; font-size: 0.875rem; font-weight: 700; border-bottom: 2px solid #0090e8; transition: all 0.5s ease-in-out;}
.sub_footer .ft_bnn .btn_go:before {display: block; position: absolute; bottom: 4px; right: 0; transform: rotate(35deg); width: 18px; height: 2px; background-color: #0090e8; content: '';}
.sub_footer .ft_bnn .btn_go:hover {right: -10px;}


.sub_footer .ft_left {float: left;}
.sub_footer .ft_link01 {margin: 0 0 10px 0; opacity: 0.6;}
.sub_footer .ft_link01:after {display: block; clear: both; *zoom: 1; content: '';}
.sub_footer .ft_link01 li {float: left; margin: 0 0 0 20px;}
.sub_footer .ft_link01 li:first-child {margin: 0;}
.sub_footer .ft_link01 li a {line-height: 1.7; color: #999;}
.sub_footer .ft_link01 li.privacy a {font-weight: 500; color: #666;}
.sub_footer .ft_txt {width: 100%; font-size: 0.875rem; color: #999; opacity: 0.6;}
.sub_footer .ft_txt p {line-height: 1.7;}
.sub_footer .ft_txt p span {position: relative; padding-right:  5px; display:inline-block;}
.sub_footer .ft_txt p span:after {display: block; position: absolute; top: 5px; right: 1.5px; width: 1px; height: 12px; background-color: #999; content: '';}
.sub_footer .ft_txt p span:last-child:after{display:none;}
.sub_footer .ft_txt p span:first-child {padding: 0 5px 0 0;}
.sub_footer .ft_txt p span:first-child:after {display: none;}
.sub_footer .ft_txt p span.address {padding: 0 5px 0 0;}
.sub_footer .ft_txt p span.address:after {display: none;}
.sub_footer .ft_txt .copy {margin: 15px 0 0 0;}
.sub_footer .ft_link02 {float: right; width: 290px;}
.sub_footer .ft_link02:after {display: block; clear: both; *zoom: 1; content: '';}
.sub_footer .ft_link02 li {float: left; margin: 0 0 0 10px; width: 140px;}
.sub_footer .ft_link02 li:first-child {margin: 0;}
.sub_footer .ft_link02 li a {display: block; height: 30px; line-height: 30px; font-size: 0.875rem; color: #999; border: 1px solid #ddd; text-align: center;}












@media screen and (min-width:1201px) and (max-width: 1600px) {

	.inner {box-sizing: border-box; width: 100%; padding: 0 30px;}

	/* menu	*/
	.gnbWrap .gnb_inner {box-sizing: border-box; width: 100%; padding: 0 0 0 60px;}
	.gnbWrap .gnb {width: 50%; padding:1% 0 1% 120px;}
	.gnbWrap .com_info {left: 60px; width: calc(50% - 120px); padding:10px 0;}

	.main_footer .copy {position: absolute; bottom: 0; left: 60px;}


	/* sub layout */

	.sub_footer .inner {width: 100%; padding: 40px 60px 100px;}
	.sub_footer .ft_bnn .inner {padding: 50px 60px 60px;}
	.sub_footer .ft_bnn .txt_box p {font-size: 1rem;}
	.sub_footer .ft_bnn .txt_box strong {margin: 30px 0 0 0; font-size: 2rem;}
	.sub_footer .ft_bnn .btn_go {bottom: 40px; right: 60px;}
	.sub_footer .ft_bnn .btn_go:hover {right: 50px;}

	.sub_footer .ft_link01 {margin: 0 0 30px 0;}

}

@media screen and (min-width:1025px) and (max-width: 1200px) {

	.inner {box-sizing: border-box; width: 100%; padding: 0 30px;}

	/* menu	*/
	.gnbWrap .gnb_inner {box-sizing: border-box; width: 100%; padding: 0 0 0 60px;}
	.gnbWrap .gnb {width: 50%; padding: 5% 0 5% 60px;}
	.gnbWrap .com_info {left: 60px; width: calc(50% - 80px);}
	.gnbWrap .com_info li p {font-size: 1rem;}

	.main_footer .copy {position: absolute; bottom: 0; left: 60px;}


	/* sub layout */

	.sub_footer .inner {width: 100%; padding: 40px 60px 100px;}
	.sub_footer .ft_bnn .inner {padding: 30px 60px 40px;}
	.sub_footer .ft_bnn .txt_box p {font-size: 1rem;}
	.sub_footer .ft_bnn .txt_box strong {margin: 30px 0 0 0; font-size: 2rem;}
	.sub_footer .ft_bnn .btn_go {bottom: 40px; right: 60px;}
	.sub_footer .ft_bnn .btn_go:hover {right: 50px;}

	.sub_footer .ft_left {float: none;}
	.sub_footer .ft_link01 {margin: 0 0 30px 0;}
	.sub_footer .ft_link02 {float: none; width: 100%; margin: 30px 0 0 0;}
	.sub_footer .quick_wrap {right: 60px;}

}

/* tablet */
@media screen and (min-width:768px) and (max-width: 1024px) {

	.inner {box-sizing: border-box; width: 100%; padding: 0 30px;}

	.main_header .logo {top: 30px; left: 30px;}
	.menu {top: 30px; right: 30px;}
  .top_fot {top:30px; right:80px;}

	.gnbWrap .gnb_inner {top: auto; transform: none; box-sizing: border-box; width: 100%; height: 100%; padding: 0;}
	.gnbWrap .gnb {top: 100px; transform: none; width: calc(100% - 30px); height: auto; padding: 2% 0 2% 60px;}
	.gnbWrap .gnb li a {line-height: 50px; font-size: 1.75rem;}
	.gnbWrap .gnb li a .num {font-size: 1.7rem;}
	.gnbWrap .com_info {top: auto; left: 40px; bottom: 120px; transform: none; float: none; width: 100%; padding: 0; border-top: 0; border-bottom: 0;}
	.gnbWrap .com_info li {float: left; width: 50%; margin: 15px 0 0 0;}
	.gnbWrap .com_info li strong {display: inline-block; font-size: 1.125rem; line-height: 24px; margin: 0 15px 0 0;}
	.gnbWrap .com_info li p {display: inline-block; font-size: 1rem; line-height: 24px;}
	.gnbWrap .com_info li.info_address {width: 100%;}
	.gnbWrap .com_info li.info_address strong {display: block;}
	.gnbWrap .com_info li.info_address p {display: block;}
	/*.gnbWrap .com_info li.info_mail {position: absolute; left: 0; bottom: -40px;}*/

	.gnbWrap .ft_util {display: block; position: absolute; left: 0; right: 0; bottom: 20px; margin: 0 auto; text-align: center;}
	.ft_util li {float: none; display: inline-block;}
	.ft_util li a {font-size: 0.8571rem;}


	#fp-nav.fp-right {right: 30px;}
	.ft_wrap {right: 30px; width: auto;}
	.ft_wrap .ft_util {display: none;}

	.main_footer .copy {text-align: left;}

	.sub_menu {right: 160px;}
	.sub_menu li {margin: 0 0 0 30px;}
	.main_menu {right: 160px; top:15px;}
	.main_menu li {margin: 0 0 0 30px;}
	.sub_sns {right: 0;}


	/* sub layout */

	.sub_menu {right: 160px;}
	.sub_menu li {margin: 0 0 0 30px;}
	.sub_sns {right: 0;}

	.sub_footer .inner {width: 100%; padding: 40px 30px 100px;}
	.sub_footer .ft_bnn .inner {padding: 30px 30px 40px;}
	.sub_footer .ft_bnn .txt_box p {font-size: 1rem;}
	.sub_footer .ft_bnn .txt_box strong {margin: 30px 0 0 0; font-size: 2rem;}
	.sub_footer .ft_bnn .btn_go {bottom: 40px; right: 30px;}
	.sub_footer .ft_bnn .btn_go:hover {right: 20px;}

	.sub_footer .ft_left {float: none;}
	.sub_footer .ft_link01 {margin: 0 0 30px 0;}
	.sub_footer .ft_link02 {float: none; width: 100%; margin: 30px 0 0 0;}
	.sub_footer .quick_wrap {right: 30px;}



 }


@media screen and (min-width:481px) and (max-width:767px) {
	html, body {font-size: 14px;}
	p, strong, em, span {white-space: normal;}

	.inner {box-sizing: border-box; width: 100%; padding: 0 30px;}

	#A_Header .logo {left: 30px;}
	.main_header {height: 60px;}
	.main_header .logo {top: 50%; transform: translateY(-50%); width: 120px; height: 20px;}
	.menu {top: 30px; right: 30px;}
	.menu p {display: none;}
  .top_fot {top:20px; right:80px;}

	.gnbWrap .gnb_inner {top: auto; transform: none; box-sizing: border-box; width: 100%; height: 100%; padding: 0;}
	.gnbWrap .gnb {top: 110px; transform: none; width: calc(100% - 40px); height: auto; padding: 3% 0 3% 8%;}
	.gnbWrap .gnb li a {line-height: 50px; font-size: 1.5rem;}
	.gnbWrap .gnb li a .num {width: 55px; margin: 0 20px 0 0; font-size: 1.5rem;}
	.gnbWrap .com_info {top: auto; left: 40px; bottom: 120px; transform: none; float: none; width: calc(100% - 40px); padding: 0; border-top: 0; border-bottom: 0;}
	.gnbWrap .com_info li {float: left; width: 50%; margin: 5px 0 0 0;}
	.gnbWrap .com_info li strong {display: inline-block; font-size: 1.125rem; line-height: 24px; margin: 0 10px 0 0;}
	.gnbWrap .com_info li p {display: inline-block; font-size: 1rem; line-height: 24px;}
	.gnbWrap .com_info li.info_address {width: 100%;}
	.gnbWrap .com_info li.info_address strong {display: block;}
	.gnbWrap .com_info li.info_address p {display: block;}
	/*.gnbWrap .com_info li.info_mail {position: absolute; left: 0; bottom: -25px; width: 100%;}*/

	.gnbWrap .ft_util {display: block; position: absolute; left: 0; right: 0; bottom: 20px; margin: 0 auto; text-align: center;}
	.ft_util li {float: none; display: inline-block;}
	.ft_util li a {font-size: 0.8571rem;}

	.main_footer {bottom: 0;}
	.ft_wrap {left: 0; right: 0; box-sizing: border-box; width: 100%; padding: 0 15px 0 0;}
	.ft_wrap .ft_util {display: none;}

	.main_footer .copy {position: absolute; left: 0; right: 0; bottom: 60px; font-size: 0.8571rem;}
	.quick_wrap {width: 100%;}
	.quick_wrap .call {border: none; background-color: rgba(0, 0, 0, 0.5); opacity: 1;}
	.quick_wrap .quick_btn {width: calc(100% - 50px); margin: 0; font-size: 1rem;height: 50px;bottom: 0px;}
	.quick_wrap .quick_btn p {float: left;font-size: 1rem;margin-top: 0;margin-left: 12%;top:0px;}
	.quick_wrap .quick_btn p span{font-size: 22px;font-weight: bold}
	.quick_wrap .call:hover + .quick_btn {background-color: #0090e8; border: 1px solid #0090e8; color: #fff;}
	.quick_write {width: 100%; background-color: rgba(0, 0, 0, 0.8);}
	.call_number {width: 100%; background-color: rgba(0, 0, 0, 0.8);}


	/* sub layout */

	.sub_header {height: 60px;}
	.sub_header .logo {top: 50%; transform: translateY(-50%); opacity: 0.5;}
	.sub_header.indicator .logo {opacity: 1;}
	.sub_menu {display: none;}
	.main_menu {display: none;}
	.sub_sns {display: none;}
	.sub_header .menu {display: block; top: 24px;}
	.project_header .menu {display: block; top: 24px;}

	.sub_footer .inner {width: 100%; padding: 40px 30px 100px;}
	.sub_footer .ft_bnn .inner {padding: 30px 30px 40px;}
	.sub_footer .ft_bnn .txt_box p {font-size: 0.8571rem;}
	.sub_footer .ft_bnn .txt_box strong {margin: 30px 0 0 0; font-size: 2.143rem;}
	.sub_footer .ft_bnn .btn_go {bottom: 40px; right: 30px;}
	.sub_footer .ft_bnn .btn_go:hover {right: 20px;}

	.sub_footer .ft_left {float: none;}
	.sub_footer .ft_link01 {margin: 0 0 20px 0;}
	.sub_footer .ft_link02 {float: none; width: 100%; margin: 20px 0 0 0;}
	.sub_footer .ft_link02 li a {height: 36px; line-height: 36px;}

	.sub_footer .quick_wrap {left: 0; right: 0; box-sizing: border-box; width: 100%; margin: 0 auto; padding: 0 30px 0 0;}
	.sub_footer .quick_wrap .call {border: 1px solid #000;}
	.sub_footer .quick_wrap .quick_btn {width: calc(100% - 50px); margin: 0;}
	.sub_footer .quick_wrap .quick_open {box-sizing: border-box; width: 100%; padding: 0 30px 0 0;}
}


/* mobile */
@media screen and (max-width:480px) {
	html, body {font-size: 14px;}
	p, strong, em, span {white-space: normal;}

	.inner {box-sizing: border-box; width: 100%; padding: 0 15px;}

	#A_Header .logo {left: 15px;}
	.main_header {height: 60px;}
	.main_header .logo {top: 50%; transform: translateY(-50%); width: 89px; height: 15px;}
	.sub_header .logo {width: 89px; height: 15px;}
	.project_header .logo {width: 89px; height: 15px;}
	.menu {top: 15px; right: 15px; width: 24px;}
	.menu p {display: none;}
  .top_fot {display:none;}

	.gnbWrap .gnb_inner {top: auto; transform: none; box-sizing: border-box; width: 100%; height: 100%; padding: 0;}
	.gnbWrap .gnb {top: 10%; transform: none; width: calc(100% - 30px); height: auto; padding: 3% 0 3% 8%;}
	.gnbWrap .gnb li a {line-height: 40px; font-size: 1.429rem;}
	.gnbWrap .gnb li a .num {width: 50px; margin: 0 20px 0 0; font-size: 1.714rem;}
	.gnbWrap .com_info {top: auto; left: 30px; bottom: 12%; transform: none; float: none; width: calc(100% - 30px); padding: 0; border-top: 0; border-bottom: 0;}
	.gnbWrap .com_info li {float: left; width: 50%; margin: 10px 0 0 0;}
	.gnbWrap .com_info li strong {display: block; font-size: 1rem; line-height: 1.3; margin: 0;}
	.gnbWrap .com_info li p {display: inline-block; font-size: 1rem; line-height: 1.3;}
	.gnbWrap .com_info li.info_address {width: 100%;}
	.gnbWrap .com_info li.info_address strong {display: block;}
	.gnbWrap .com_info li.info_address p {display: block;}
	/*.gnbWrap .com_info li.info_mail {position: absolute; left: 0; bottom: -25px; width: 100%;}*/





	.gnbWrap .ft_util {display: block; position: absolute; left: 0; right: 0; bottom: 10px; margin: 0 auto; text-align: center;}
	.ft_util li {float: none; display: inline-block;}
	.ft_util li a {font-size: 0.8571rem;}



	.main_footer {bottom: 0;}
	.ft_wrap {left: 0; right: 0; box-sizing: border-box; width: 100%; padding: 0 15px 0 0;}
	.ft_wrap .ft_util {display: none;}

	.main_footer .copy {position: absolute; left: 0; right: 0; bottom: 60px; font-size: 0.8571rem;}
	.quick_wrap {width: 100%; border-radius: 0 20px 0 0;}
	.quick_wrap .call {border: none; background-color: rgba(0, 0, 0, 0.5); opacity: 1;}
	.quick_wrap .quick_btn {width: calc(100% - 50px); margin: 0; font-size: 1rem;height: 50px;bottom: 0;}
	.quick_wrap .quick_btn p {float: left;font-size: 1rem;margin-top: 0;margin-left: 10%;top: 0;}
	.quick_wrap .quick_btn p span{font-size: 18px;font-weight: bold}
	.quick_wrap .call:hover + .quick_btn {background-color: #D92C2C; border: 1px solid #D92C2C; color: #fff;}
	.quick_write {width: 100%; background-color: rgba(0, 0, 0, 0.8);}
	.call_number {width: 100%; background-color: rgba(0, 0, 0, 0.8);}


	/* sub layout */

	.sub_header {height: 60px;}
	.sub_header .logo {top: 50%; transform: translateY(-50%); opacity: 0.5;}
	.sub_header.indicator .logo {opacity: 1;}
	.sub_menu {display: none;}
	.main_menu {display: none;}
	.sub_sns {display: none;}
	.sub_header .menu {display: block; top: 24px;}

	.project_header .menu {display: block; top: 24px;}

	.sub_footer .inner {width: 100%; padding: 40px 15px 90px;}
	.sub_footer .ft_bnn .inner {padding: 30px 15px 40px;}
	.sub_footer .ft_bnn .txt_box p {font-size: 0.8571rem;}
	.sub_footer .ft_bnn .txt_box strong {margin: 30px 0 0 0; font-size: 2.143rem;}
	.sub_footer .ft_bnn .btn_go {bottom: 40px; right: 30px;}
	.sub_footer .ft_bnn .btn_go:hover {right: 20px;}

	.sub_footer .ft_left {float: none;}
	.sub_footer .ft_link01 {margin: 0 0 20px 0;}
	.sub_footer .ft_txt p span:after {top: 3.5px;}
	.sub_footer .ft_link02 {float: none; width: 100%; margin: 20px 0 0 0;}
	.sub_footer .ft_link02 li a {height: 36px; line-height: 36px;}

	.sub_footer .quick_wrap {left: 0; right: 0; box-sizing: border-box; width: 100%; margin: 0 auto; padding: 0 15px 0 0;}
	.sub_footer .quick_wrap .call {border: 1px solid #000;}
	.sub_footer .quick_wrap .quick_btn {width: calc(100% - 50px); margin: 0;}
	.sub_footer .quick_wrap .quick_open {box-sizing: border-box; width: 100%; padding: 0 15px 0 0;}
}