/*COMMON*/
.container { width: 1200px; margin: 0 auto; }
.container:after { content: ''; display: block; clear: both; visibility: hidden; }
.cont { line-height: 1.5; margin-bottom: 50px; text-align: center; }
.cont:last-child { margin: 0; }

.txt_c { text-align: center; }

.page_tit { text-align: center; font-size: 30px; font-weight: bold; position: relative; padding-bottom: 12px; margin-bottom: 60px; }
.page_tit span { display: block; font-size: 16px; font-weight: normal; }
.page_tit:after { content: ''; display: block; width: 70px; height: 4px; background: #597b97; position: absolute; bottom: 0; left: 50%; margin-left: -35px; }
.tit_md { font-size: 20px; font-weight: bold; }
.tit_sm { font-size: 18px; font-weight: bold; }

.clear:after { content: ''; display: block; clear: both; visibility: hidden; }
.hide { display: none; }

.top_bnr .title { width: 100%; height: 220px; background: url(../img/top_bg.jpg) no-repeat center / auto 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.top_bnr .title p:first-child { font-size: 50px; color: #0c2237; font-weight: bold; }
.top_bnr .title p:last-child { font-size: 18px; }
.top_bnr .loc { background: #4d7696; color: #fff; }
.top_bnr .loc p { width: 1200px; margin: 0 auto; text-align: right; padding: 15px 0; }

.sub_list { width: 1200px; margin: 60px auto 80px; text-align: center; }
.sub_list ul { display: inline-block; }
.sub_list li { float: left; position: relative; font-size: 17px; padding: 0 33px 0 30px; }
.sub_list li:after { content: ''; display: block; width: 3px; height: 3px; background: #000; border-radius: 50%; position: absolute; top: 15px; right: 0; }
.sub_list li:first-child { padding-left: 0; }
.sub_list li:last-child { padding-right: 0; }
.sub_list li:last-child:after { display: none; }
.sub_list li a { display: block; padding: 5px; }
.sub_list li.on a { font-weight: bold; }

.pagenation ul { display: inline-block; border-right: 1px solid #ccc; }
.pagenation ul li { float: left; width: 34px; line-height: 30px; border: 1px solid #ccc; border-right: none; cursor: pointer; }
.pagenation ul li.on { background: #ccc; font-weight: bold; }

#popup { position: absolute; top: 73px; left: 20px; border: 1px solid #ccc; width: 235px; }
#popup img { width: 100%; height: auto; display: block; }
#popup .bottom { margin: 0; padding: 5px 10px; text-align: right; background: #464646; color: #fff; cursor: pointer; }
#popup .bottom span { cursor: pointer; }

/*HEADER*/
header .log { width: 1200px; margin: 0 auto; text-align: right; font-size: 12px; padding: 10px 99px 0 0; }
header .logo {width: 1200px; margin: 0 auto; padding: 20px 0; padding-left: 112px; position: relative; }
header .logo p { font-weight: normal; font-size: 18px; line-height: 1.4; text-align: left; color: #254f75; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
header .gnb { font-size: 17px; text-align: center; background: #bababa; }
header .gnb:after { content: ''; display: block; clear: both; }
header .gnb > li { display: inline-block; width: 200px; margin: 0 10px; padding: 10px 0; position: relative; }
header .gnb > li.on p { font-weight: bold; }
header .gnb > li a { display: inline-block; padding: 15px 15px; }
header .gnb > li:last-child a { padding-right: 0; }
header .gnb .sub { width: 100%; background: rgba(77,118,150,0.8); font-size: 15px; color: #fff; padding: 10px 0; position: absolute; top: 100%; left: 0; display: none; z-index: 100; }
header .gnb .sub li { line-height: 1; text-align: center; }
header .gnb .sub li a { display: block; padding: 10px 12px; }
header .gnb > li:hover .sub { display: block; }


/*FOOTER*/
footer { background: #bababa; font-size: 15px; margin-top: 150px; }
footer .container { padding: 50px 0; }
footer .logo , footer .info { float: left; }
footer .logo { width: 200px; }
footer .info { width: 1000px; }
footer ul { margin-left: -10px; font-weight: bold; }
footer ul li { display: inline-block; padding: 0 17px 0 10px; position: relative; }
footer ul li:after { content: ''; display: block; width: 1px; height: 12px; background: #333; position: absolute; top: 4px; right: 0; }
footer ul li:last-child:after { display: none; }
footer .branch { margin: 20px 0 30px; line-height: 1.4; }
footer .branch dl { float: left; margin-right: 60px; }
footer .branch dl:last-child { margin: 0; }
footer .branch dl dt { font-weight: bold; }
footer p:last-child { font-size: 13px; opacity: 0.9; }

footer .ft_tel { width: 100%; height: 102px; background: url(../img/main_tel_bg.jpg) no-repeat center / 100% auto; padding-top: 22px; text-align: center; }
footer .ft_tel p, footer .ft_tel img { display: inline-block; vertical-align: middle; }
footer .ft_tel p { color: #fff; font-weight: bold; margin-left:15px; letter-spacing: -0.8px; }
footer .ft_tel p:nth-child(2) { font-size: 26px; }
footer .ft_tel p:nth-child(3) { font-weight: normal; margin-left: 8px; }
footer .ft_tel p:last-child { color: #faff6f; font-size: 46px; margin-left: 25px; }

/*INDEX*/
#idx .main {width: 100%;height: 680px; position: relative;}
#idx .main .owl-carousel .item { height: 680px; }
#idx .main_txt {color: #fff; position: absolute; top: 40%; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); z-index: 2; }
#idx .main_txt h1 { font-size: 50px; }
#idx .main_txt p { font-size: 18px; margin-top: 5px; }
#idx .tel {width: 100%;height: 102px;background: url(../img/main_tel_bg.jpg) no-repeat center / 100%;margin-top: -51px;padding-top: 22px;z-index: 10;position: relative;}
#idx .tel p, #idx .tel img { display: inline-block; vertical-align: middle; }
#idx .tel p { color: #fff; font-weight: bold; margin-left:15px; letter-spacing: -0.8px; }
#idx .tel p:nth-child(2) { font-size: 26px; }
#idx .tel p:nth-child(3) { font-weight: normal; margin-left: 8px; }
#idx .tel p:last-child { color: #faff6f; font-size: 46px; margin-left: 25px; }

#idx .page_tit { margin-bottom: 20px; }

#idx .prod { margin-top: 130px; }
#idx .prod ul { margin-top: 50px; }
#idx .prod ul li { float: left; width: 390px; margin-left: 15px; }
#idx .prod ul li:first-child { margin: 0; }
#idx .prod ul li .box { height: 320px; color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; }
#idx .prod ul li:nth-child(1) .box { background: url(../img/prod_01.jpg); }
#idx .prod ul li:nth-child(2) .box { background: url(../img/prod_02.jpg); }
#idx .prod ul li:nth-child(3) .box { background: url(../img/prod_03.jpg); }
#idx .prod ul li .box p { font-size: 26px; font-weight: bold; }
#idx .prod ul li .box a {
	width: 160px;
	border: 1px solid #fff;
	text-align: center;
	padding: 6px 0 8px;
	margin-top: 15px;
	font-weight: 100;
	transition: background 0.3s;
	-webkit-transition: background 0.3s;
	-moz-transition: background 0.3s;
	-o-transition: background 0.3s;
}
#idx .prod ul li .box a:hover { background: rgba(0,0,0,0.4); }


/*COMPANY*/
#intro .txt_c h3 { font-size: 26px; margin: 30px 0; }

#delivery dl { width: 60%; margin: 0 auto; }
#delivery dl dt { font-size: 20px; font-weight: bold; text-align: left; }
#delivery dl dt i { font-size: 34px; color: #339b75; margin-right: 6px; }
#delivery dl dd { border: 1px solid #ccc; padding: 30px; margin-top: 6px; }

#history .cont { width: 60%; margin: 0 auto; text-align: left; }
#history .img { float: left; margin: 0 30px 30px 0; }
#history dl:not(:last-child) { margin-bottom: 30px }
#history dl dt { font-weight: bold; margin-bottom: 6px; font-size: 18px; }
#history dl dt:before { content: ''; width: 10px; height: 10px; background: #fe780b; display: inline-block; border-radius: 50%; margin: 0 5px 1px 0; }
#history dl dd { margin-top: 5px; word-break: keep-all; }

#scene li { width: 33.333%; float: left; margin-top: 40px; }
#scene li:nth-child(-n+3) { margin-top: 0; }
#scene li:first-child { display: block; }

#process .cont { width: 70%; margin: 0 auto; }
#process .img { width: 193px; float: right; }
#process .txt { width: calc(100% - 230px); float: left; text-align: left; }
#process .txt dl:not(:first-child) { margin-top: 40px; }
#process .txt dl dt { font-size: 18px; font-weight: bold; margin-bottom: 6px; }
#process .txt dl dd { margin-top: 3px; word-break: keep-all; }

#manual table { width: 70%; margin: 0 auto; text-align: left; }
#manual table:not(:first-child) { margin-top: 15px; }
#manual table tr th, #manual table tr td { border: 1px solid #ccc; }
#manual table caption { font-size: 18px; font-weight: bold; margin-bottom: 6px; }
#manual table caption span { font-size: 14px; display: block; font-weight: normal; margin: -2px 0 6px; opacity: 0.8; }
#manual table.normal tr, #manual table.normal td { background: #f0f0f0; }
#manual table.frame th { background: #ebf5ed; }
#manual table.frame tr:first-child td { background: #bcd59b; text-align: center; border-right: 1px solid #fff; }
#manual table.frame tr:first-child td:last-child { border-right-color: #ccc; }
#manual table.common th { background: #bcd59b; font-weight: normal; }
#manual table.common td { background: #ebf5ed; }
#manual table.color th { background: #bcd59b; border-right: 1px solid #fff; }
#manual table.color th:last-child { border-right-color: #ccc; }
#manual table.odd tr { background: #ebf5ed; }
#manual table.odd tr:nth-child(odd) { background: #bcd59b; }

#manual .txt_box p { margin-top: 3px; }

#size dl dt { font-size: 18px; font-weight: bold; margin-bottom: 6px; }
#size dl dd { margin-top: 3px; word-break: keep-all; }
#size table { width: 70%; margin: 0 auto; }
#size table tr th, #size table tr td { border: 1px solid #fff; text-align: center; padding: 5px 0; vertical-align: middle; }
#size table tr th { background: #bcd59b; font-weight: normal; }
#size table tr td { background: #ebf5ed; }

#color .page:not(:first-child) { display: none; }
#color .page ul:after { content: ''; display: block; clear: both; visibility: hidden; }
#color .page ul li { width: 20%; float: left; margin-bottom: 50px; }
#color .page ul li:nth-child(5n+1) { clear: left; }

#prod .page:not(:first-child) { display: none; }
#prod .page ul { margin: 0 -10px; }
#prod .page ul li { width: 25%; float: left; padding: 0 10px; margin-bottom: 40px; cursor: pointer; }
#prod .page ul li:nth-child(4n+1) { clear: left; }
#prod .page ul li .thumb { width: 100%; height: 0; padding-top: 90%; position: relative; border: 1px solid #ccc; }
#prod .page ul li img { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; }
#prod .page ul li p { margin-top: 5px; }

#prod .drawing { width: 80%; margin: 0 auto; }
#prod .drawing ul { margin: -20px -10px 0; }
#prod .drawing ul li { width: 33.333%; float: left; padding: 20px 10px; cursor: pointer; }
#prod .drawing ul li:nth-child(3n+1) { clear: left; }

#prod .view_img { max-width: 70%; padding: 50px 40px 20px; background: #fff; border: 1px solid #ccc; text-align: center; position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 10; display: none; }
#prod .view_img .close { font-size: 34px; width: 40px; position: absolute; top: 0; right: 0; cursor: pointer; }
#prod .view_img .img_txt { font-size: 18px; margin-top: 8px; }
#prod .view_img .img_box img { width: 100%; height: auto; display: block; }

#prod .kind { text-align: center; }
#prod .kind ul:first-child { margin-top: -20px; }
#prod .kind ul:last-child { margin-bottom: 60px; }
#prod .kind ul li { display: inline-block; padding: 3px 10px; }
#prod .kind ul li a { display: block; padding: 8px 10px; }
#prod .kind ul li.on a { background: #4d7696; color: #fff; border-radius: 20px; }

#drawing .cont { width: 70%; margin: 0 auto; }
#drawing .list { width: 70%; height: 560px; border: 1px solid #ccc; border-right: none; float: left; }
#drawing .list li { width: 100%; height: 100%; display: none; position: relative; }
#drawing .list li:first-child { display: block; }
#drawing .list li img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
#drawing .kind { width: 30%; float: left; border-bottom: 1px solid #ccc; }
#drawing .kind li { border: 1px solid #ccc; border-bottom: none; text-align: left; padding: 10px 15px; cursor: pointer; }
#drawing .kind li.on { background: #597b97; color: #fff; }

#board_list .list li { width: 25%; float: left; padding: 0 10px; margin-bottom: 40px; }
#board_list .list li .thumb { width: 100%; height: 0; padding-top: 90%; position: relative; overflow: hidden; border: 1px solid #ccc; }
#board_list .list li .thumb img { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0%; }
#board_list .list li .thumb .label { position: absolute; top: 8px; right: 8px; z-index: 1; padding: 2px 20px 4px; font-size: 16px; color: #fff; border-radius: 20px; }
#board_list .list li.end .thumb .label { background: #ccc; }
#board_list .list li.sale .thumb .label { background: #e05d35; }
#board_list .list li.ing .thumb .label { background: #4d7696; }

#board_list .list li .tit { text-align: left; border: 1px solid #ccc; border-top: none; padding: 10px 6px 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

#board_list .list li.sale:hover .thumb { border-color: #e05d35; }
#board_list .list li.sale:hover .tit { background: #e05d35; color: #fff; border-color: #e05d35; }
#board_list .list li.ing:hover .thumb { border-color: #4d7696; }
#board_list .list li.ing:hover .tit { background: #4d7696; color: #fff; border-color: #4d7696; }

#board_view .tit_md { padding-bottom: 20px; }
#board_view .img_box { border: 1px solid #ccc; text-align: center; margin-bottom: 30px; }
#board_view .img_box .big { padding: 50px; background: #f9f9f9; }
#board_view .img_box .big img { max-width: 100%; }
#board_view .img_box .thumb { padding: 20px; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
#board_view .img_box .thumb li { width: 282px; height: 150px; float: left; margin-right: 10px; padding: 0 5px; border: 1px solid #ccc; overflow: hidden; cursor: pointer; position: relative; }
#board_view .img_box .thumb li:last-child { margin: 0; }
#board_view .img_box .thumb li.on { border-color: #4d7696; }
#board_view .img_box .thumb li img { width: auto; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }

#board_view .txt_box .tit { border-top: 2px solid #ccc; border-bottom: 1px solid #ccc; text-align: center; font-size: 18px; padding: 8px 0 10px; }
#board_view .txt_box .txt { text-align: left; padding: 20px 0; border-bottom: 1px solid #ccc; }

#board_view .btn { text-align: center; margin-top: 30px; }
#board_view .btn a { display: inline-block; background: #4d7696; color: #fff; padding: 12px 40px 14px; }

.pagenation { text-align: center; margin-top: 40px; }
.pagenation ul { display: inline-block; }
.pagenation li { float: left; padding: 3px 8px; border: 1px solid #ccc; border-right-width: 0; cursor: pointer; }
.pagenation li:last-child { border-right-width: 1px; }
.pagenation li.on { background: #ccc; }