﻿@charset "utf-8";

.pw_bg{background:#888; opacity:0.8; z-index:70; width:100%; position:absolute; top:0; right:0; display:none;}

#wrap #container .section1 .visual_wrap .visual li.company{background:url(/images/sub/company_visual.jpg) center center no-repeat; background-size:cover;}
#wrap #container .section1 .visual_wrap .visual li.portfolio{background:url(/images/sub/portfolio_visual.jpg) center center no-repeat; background-size:cover;}

#wrap #container .section2 > div > span{color:#fff; width:100%; text-align:center; font-size:48px; display:block; font-weight:500; margin-bottom:100px;}

#wrap #container .section2 .company{margin-bottom:100px;}
#wrap #container .section2 .company .company_wrap{text-align:center; max-width:1000px; width:100%; margin:0 auto;}
#wrap #container .section2 .company .company_wrap p{font-size:30px; color:#ddd; font-weight:500; margin-bottom:70px;}
#wrap #container .section2 .company .company_wrap span{font-size:18px; color:#aaa; font-weight:500; line-height:30px; margin-top:30px; display:block; text-align:left;}
#wrap #container .section2 .company .company_wrap img{margin-top:100px; margin-bottom:140px; width:100%; max-width:718px;}
#wrap #container .section2 .company .company_wrap .company_table{border-collapse:collapse; border-spacing:0; table-layout:fixed; border-top:2px solid #ea851c; width:100%; max-width:1000px; margin:0 auto;}
#wrap #container .section2 .company .company_wrap .company_table tr th{font-size:18px; color:#ddd; border-bottom:1px solid #444; padding:15px 0; text-align:center;}
#wrap #container .section2 .company .company_wrap .company_table tr td{font-size:18px; color:#aaa; border-bottom:1px solid #444; padding:15px 0;}
#wrap #container .section2 .company .company_wrap .company_table tr td b:nth-child(3), #wrap #container .section2 .company .company_wrap .company_table tr td b:nth-child(6){background:none;}

#wrap #container .section2 .maintenance{max-width:1200px; margin:0 auto 150px; width:100%; position:relative;}
#wrap #container .section2 .maintenance .search_wrap{text-align:right; font-size:0; margin-bottom:20px;}
#wrap #container .section2 .maintenance .search_wrap select{height:42px; line-height:42px; border:0; background:none; border-bottom:2px solid #888; max-width:140px; width:40%; margin-right:20px; box-sizing:content-box; vertical-align:top; color:#888; font-size:18px; font-weight:500;}
#wrap #container .section2 .maintenance .search_wrap .search_text{display:inline-block; position:relative; max-width:320px; width:50%;}
#wrap #container .section2 .maintenance .search_wrap .search_text input{width:100%; height:42px; line-height:42px; border:0; background:none; border-bottom:2px solid #888; box-sizing:content-box; vertical-align:top; font-size:18px; font-weight:500; color:#888;}
#wrap #container .section2 .maintenance .search_wrap .search_text input:focus{outline:0;}
#wrap #container .section2 .maintenance .search_wrap .search_text a{position:absolute; top:0; right:10px;}

#in_pw{z-index:89; width:100%; max-width:1200px; margin:-270px auto 0; text-align:center; border-top:2px solid #ea851c; border-bottom:1px solid #444; box-sizing:border-box; padding:100px 0 150px; position:absolute; top:50%; background:#2b2b2b; box-sizing:border-box;}
#in_pw .pw_close{position:absolute; top:10px; right:10px;}
#in_pw p.info_text{font-size:24px; color:#ea851c; font-weight:500; margin:50px 0;}
#in_pw p.input_box{font-weight:500; line-height:39px; font-size:0;}
#in_pw p.input_box span{color:#fff; font-size:24px; display:inline-block;}
#in_pw p.input_box input{height:39px; line-height:39px; max-width:350px; width:50%; color:#303030; background:#5c5c5c; font-size:24px; box-sizing:border-box; padding:0; padding-left:30px; margin:0 20px; border:0;}
#in_pw p.input_box a{width:77px; display:inline-block; height:39px; line-height:39px; color:#fff; font-size:24px; text-align:center; background:#ea851c;}

#wrap #container .section2 .sub_contact{max-width:1200px; margin:0 auto; width:100%;}
.sub_contact_con:after{display:block; clear:both; content:'';}
.sub_contact_con p.info{font-size:18px; color:#ddd; font-weight:500; margin-bottom:10px; line-height:22px;}
.sub_contact_con .sub_contact_left{width:55%; margin-right:5%; float:left;}
.sub_contact_con .sub_contact_left p{margin-top:30px;}
.sub_contact_con .sub_contact_left input[type="text"]{background:none; border:0; padding-left:10px; box-sizing:border-box; border-bottom:2px solid #888; color:#888; font-size:18px; font-weight:500; height:35px; width:100%;}
.sub_contact_con .sub_contact_left input[type="file"]{background:none; font-size:16px; width:100%; color:#888; }
.sub_contact_con .sub_contact_left p.number{vertical-align:middle;font-size:0;}
.sub_contact_con .sub_contact_left p.number input[type="text"]{width:30%; vertical-align:middle;}
.sub_contact_con .sub_contact_left p.number b{width:5%; font-size:18px; line-height:35px; display:inline-block; color:#888; text-align:center;}
.sub_contact_con .sub_contact_left p.email{vertical-align:middle;font-size:0;}
.sub_contact_con .sub_contact_left p.email input[type="text"]{width:30%; vertical-align:middle;}
.sub_contact_con .sub_contact_left p.email b{width:5%; font-size:18px; line-height:35px; display:inline-block; color:#888; text-align:center;}
.sub_contact_con .sub_contact_left p.email select{width:30%; margin-right:5%; background:none; border:0; padding-left:10px; box-sizing:border-box; border-bottom:2px solid #888; color:#888; font-size:18px; font-weight:500; height:35px; vertical-align:middle; background: transparent;}
.sub_contact_con .sub_contact_right{width:40%; float:left;}
.sub_contact_con .sub_contact_right textarea{width:100%; box-sizing:border-box; height:512px; border:1px solid #888; padding:20px; font-size:18px; color:#888; font-weight:500; background:none;}

.list{border-collapse:collapse; border-spacing:0; table-layout:fixed; border-top:2px solid #ea851c; width:100%; max-width:1200px; margin:0 auto;}
.list tr th{text-align:center; color:#fff; font-size:18px; font-weight:500; padding:20px 0; background:#333;}
.list tr td{text-align:center; font-size:18px; color:#ddd; font-weight:500; padding:20px 0; border-bottom:1px solid #444;}
.list tr td.tl{text-align:left; padding-left:60px;}
.list tr td.tl a{color:#ddd; display:inline-block; max-width:500px; width:100%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.list tr td.tl a img{vertical-align:top; margin-right:9px;}
.list tr th.number{width:10%;}
.list tr th.title{width:45%;}
.list tr th.writter{width:15%;}
.list tr th.date{width:15%;}
.list tr th.result{width:15%;}

.view{border-collapse:collapse; border-spacing:0; table-layout:fixed; border-top:2px solid #ea851c; width:100%; max-width:1200px; margin:0 auto;}
.view tr th{padding:20px 0; background:#333;}
.view tr th.title{padding:35px 0;}
.view tr th.title p{display:block; float:left; width:15%; color:#fff; font-size:18px; font-weight:500; box-sizing:border-box; text-align:center; line-height:26px;}
.view tr th.title p.title_txt{padding-left:50px; font-size:24px; width:70%; text-align:left;}
.view tr td{text-align:left; font-size:18px; color:#fff; font-weight:500; padding:20px 0; border-bottom:1px solid #444; padding-left:50px;}
.view tr td.con{vertical-align:top; padding:40px 50px;}
.view tr td.con .con_wrap{min-height:250px;}
.view tr td.file a{color:#fff;}
 
.write{border-collapse:collapse; border-spacing:0; table-layout:fixed; border-top:2px solid #ea851c; width:100%; max-width:1200px; margin:0 auto;}
.write tr{}
.write tr th{border-bottom:1px solid #444; color:#fff; display:table;width:100%;}
.write tr th span{width:38%; text-align:left; box-sizing:border-box; display:table-cell; vertical-align:middle; padding:0 20px;}
.write tr th span.title{width:12%; text-align:center; font-size:18px; color:#fff; background:#333; padding:20px 0;}
.write tr th span input[type="text"]{background:none; border:0; padding-left:10px; box-sizing:border-box; border-bottom:2px solid #888; color:#888; font-size:18px; font-weight:500; height:30px; width:100%;}
.write tr th span input[type="password"]{background:none; border:0; padding-left:10px; box-sizing:border-box; border-bottom:2px solid #888; color:#888; font-size:18px; font-weight:500; height:30px; width:100%;}
.write tr th span input[type="text"]:focus{outline:0;}
.write tr th span input[type="password"]:focus{outline:0;}
.write tr th span.email{vertical-align:middle;font-size:0;}
.write tr th span.email input[type="text"]{width:30%; vertical-align:middle;}
.write tr th span.email b{width:5%; font-size:18px; line-height:30px; display:inline-block; color:#888; text-align:center;}
.write tr th span.email select{width:30%; margin-left:5%; background:none; border:0; padding-left:10px; box-sizing:border-box; border-bottom:2px solid #888; color:#888; font-size:18px; font-weight:500; height:30px; vertical-align:middle; background: transparent;}
.write tr th span.col{width:88%; padding-top:15px; padding-bottom:15px;}
.write tr th span.col textarea{background:none; width:100%; height:350px; border:1px solid #888; box-sizing:border-box; color:#888; padding:10px; font-size:18px; overflow:hidden;}
.write tr th span.col input[type="file"]{background:none; font-size:16px; width:100%; color:#888;background: transparent;}
.write tr td{text-align:left; font-size:18px; color:#888; font-weight:500; padding:15px 20px; border-bottom:1px solid #444;}
  

.pasing{font-size:0; text-align:center; height:45px; line-height:45px; margin-top:50px;}
.pasing a{display:inline-block; box-sizing:border-box; width:45px; height:45px; line-height:43px; border:1px solid #888; margin-left:10px; font-size:18px; font-weight:500; color:#888; background:#282828; vertical-align:top;}
.pasing a:hover, .pasing a.active{background:#ea851c; color:#fff;}
.pasing a.home{background:url(/images/sub/home.png) no-repeat; border:0;}
.pasing a.home:hover{background:url(/images/sub/home_hover.png) no-repeat; border:0;}
.pasing a.prev{background:url(/images/sub/prev.png) no-repeat; border:0;}
.pasing a.prev:hover{background:url(/images/sub/prev_hover.png) no-repeat; border:0;}
.pasing a.next{background:url(/images/sub/next.jpg) no-repeat; border:0;}
.pasing a.next:hover{background:url(/images/sub/next_hover.png) no-repeat; border:0;}
.pasing a.end{background:url(/images/sub/end.jpg) no-repeat; border:0;}
.pasing a.end:hover{background:url(/images/sub/end_hover.png) no-repeat; border:0;}
.pasing a:first-child{margin-left:0;}

.button{text-align:center; width:100%; margin-top:80px; font-size:0;}
.button a{display:inline-block; width:200px; height:58px; line-height:58px; color:#fff; font-size:24px; background:#ea851c; font-weight:500; margin-left:20px;}
.button a:first-child{margin-left:0;}
@media screen and (max-width:1000px){
#wrap #container .section2 .company .company_wrap span br{display:none;}
#wrap #container .section2 .company .company_wrap span b{display:block;}
}
@media screen and (max-width:800px){
	#wrap #container .section1 .visual_wrap .visual li.company{background:url(/images/sub/m_company_visual.jpg) center center no-repeat; background-size:cover;}
	#wrap #container .section1 .visual_wrap .visual li.portfolio{background:url(/images/sub/m_portfolio_visual.jpg) center center no-repeat; background-size:cover;}
	
	#wrap #container .section2 > div > span{margin-bottom:50px;}
	.sub_contact_con{padding:0 30px;}
	#wrap #container .section2 .company .company_wrap{padding:0 30px; box-sizing:border-box;}
	#wrap #container .section2 .company .company_wrap p{font-size:20px; line-height:36px;}
	#wrap #container .section2 .company .company_wrap p b{display:block;}
	#wrap #container .section2 .company .company_wrap span{font-size:15px;}	
	#wrap #container .section2 .company .company_wrap img{margin:50px 0;}	
	#wrap #container .section2 .maintenance{padding:0 30px; box-sizing:border-box; margin-bottom:50px; margin-top:30px;}
	#wrap #container .section2 .sub_contact{margin-top:30px;}
	.sub_contact_con .sub_contact_left{width:100%; float:none; margin-right:0;}
	.sub_contact_con .sub_contact_right{width:100%; float:none; margin-top:30px;}
	.button{margin-top:50px;}
	.button a{width:130px; height:45px; line-height:45px; font-size:18px; margin-left:15px;}	
	
	.list tr th.number{display:none;}
	.list tr th.result{display:none;}
	.list tr td.tl{padding-left:30px;}
	.list tr td:first-child, .list tr td:nth-child(5){display:none;}
	
	.view tr th.title{padding:25px 0;}
	.view tr th.title p{float:right; width:auto; padding:0 15px; max-width:200px;}
	.view tr th.title p.title_txt{width:100%; float:none; margin-bottom:20px; max-width:100%;}
	
	.write tr th span.title{width:20%;}
	.write tr th span.col{width:80%;}
	.write tr th.m_top span.title{padding:0; width:20%;}
	.write tr th.m_top span{width:80%; display:block; float:left; height:55px; line-height:55px; padding:0 10px;}
	
	.pasing{margin-top:30px;}
	.pasing a{width:30px; height:30px; line-height:28px; font-size:15px; margin-left:5px;}
	.pasing a.home, .pasing a.prev, .pasing a.next, .pasing a.end{background-size:30px;}
	
	#in_pw{width:100%; padding:50px 0 100px; margin-top:-220px; left:0;}
	#in_pw p.info_text{margin:30px 0;}
}
@media screen and (max-width:640px){
	#wrap #container .section2 .company .company_wrap .company_table tr td b{display:block; margin-top:3px;}
}
@media screen and (max-width:600px){
	.sub_contact_con p.info{font-size:15px;}
	.sub_contact_con .sub_contact_left input[type="text"]{font-size:15px;}
	.sub_contact_con .sub_contact_left p.email select{font-size:15px;}
	.sub_contact_con .sub_contact_left input[type="file"]{font-size:15px;}	
	.sub_contact_con .sub_contact_right textarea{font-size:15px;}		
	
	#wrap #container .section2 .maintenance .search_wrap select{font-size:15px;}
	#wrap #container .section2 .maintenance .search_wrap .search_text input{font-size:15px;}
	.list tr th{font-size:15px;}
	.list tr th.title{width:50%;}
	.list tr th.writter{width:25%;}
	.list tr th.date{width:25%;}		
	.list tr td{font-size:15px;}
	.list tr td.tl{padding-left:10px;}		
	
	.write tr th span.title{font-size:15px;}
	.write tr th span input[type="text"]{font-size:15px;}
	.write tr th span.col textarea{font-size:15px; height:260px;}
	.write tr th span.col input[type="file"]{font-size:15px;}
	.write tr th span.email select{font-size:15px; padding-left:0px;}
	
	.view tr th.title p{font-size:15px;}	
	.view tr th.title p.title_txt{font-size:18px; padding-left:30px;}
	.view tr td{font-size:15px;}	
	.view tr td.con{padding:20px; font-size:15px;}
	
	#wrap #container .section2 .company .company_wrap .company_table tr th{font-size:15px; width:30% !important;}	
	#wrap #container .section2 .company .company_wrap .company_table tr td{font-size:15px; line-height:20px; width:70% !important; padding-left:20px;}
	
	#in_pw p.info_text{font-size:18px;}
	#in_pw p.input_box span{font-size:18px;}
	#in_pw p.input_box input{font-size:18px; width:40%; margin:0 10px;}
	#in_pw p.input_box a{font-size:18px; width:50px;}
}
@media screen and (max-width:480px){
	.button a{width:30%; margin-left:10px;}	
}

@media screen and (max-width:400px){
	.sub_contact_con{padding:0 15px;}
	#wrap #container .section2 .maintenance{padding:0 15px;}
	
		#in_pw p.info_text{font-size:16px;}
	#in_pw p.input_box span{font-size:16px;}
	#in_pw p.input_box input{font-size:16px;}
	#in_pw p.input_box a{font-size:16px;}
}

@media screen and (max-width:350px){
	.sub_contact_con{padding:0;}
	#wrap #container .section2 .maintenance{padding:0;}
	#wrap #container .section2 .company .company_wrap{padding:0;}
}