/*---- content ----*/

#content {width:100%; min-width:1200px; padding:100px 0;}
#content>h2 {text-align: center; font-size:16px; color:#666; line-height: 55px; margin-bottom:80px;}
#content>h1 {text-align: center; font-size:30px; margin-top:30px;}

/*---- head_office ----*/
#head_office {width:1200px; margin:auto; position: relative; height:900px; margin-bottom:150px; opacity: 0; margin-top:200px;}
#head_office dl.rocation {width:800px; height:160px; background:#f5f5f5; position: absolute; top:310px; left:50%; margin-left:-400px; border:1px solid #e5e5e5;}
#head_office dl:nth-of-type(2) {width:1200px; height:200px; margin:auto; margin-top:150px; border-bottom:1px solid #e6e6e6;}
#head_office dl:nth-of-type(2) dt {margin:0; width:100px; height:100px; float:left; margin-right:40px;}
#head_office dl:nth-of-type(2) dt img {width:130px;}
#head_office dl:nth-of-type(2) dd {float:left;}
#head_office dl:nth-of-type(2) dd h1 {color:#444; font-size:20px; margin-bottom:20px;}
#head_office dl:nth-of-type(2) dd h2 {color:#444; margin-bottom:10px;}
#head_office dl:nth-of-type(2) dd h2 span {display:inline-block; width:70px; background:#8abd32; color:white; border-radius: 5px; margin-right:20px; text-align: center;}
#head_office dl:nth-of-type(2) dd h2:first-of-type span {background:#004c98}
#head_office dl:nth-of-type(3) {width:1200px; height:150px; margin:auto; margin-top:30px;}
#head_office dl:nth-of-type(3) dt {margin:0; width:100px; height:100px; float:left; margin-right:40px;}
#head_office dl:nth-of-type(3) dt img {width:130px;}
#head_office dl:nth-of-type(3) dd {float:left; margin-top:25px;}
#head_office dl:nth-of-type(3) dd h1 {color:#444; font-size:20px; margin-bottom:20px;}
#head_office dl:nth-of-type(3) dd h2 {color:#444;}
#head_office dl:nth-of-type(3) dd h2 span {padding:6px 23px; background:#8abd32; color:white; border-radius: 5px; margin-right:20px;}
#head_office dt {float:left; width:300px; height:100px; border-right:1px solid RGBA(0,0,0,0.3); text-align: center; font-size:25px; font-family: "nanumL"; line-height: 100px; margin-top:35px; margin-left:30px; margin-right:50px;}
#head_office dd {margin-top:27px; line-height: 28px;}
#head_office dd span {font-family: "nanumR"; font-size:14px;}
#head_office dd h1,h2 {font-size:14px;}


/*---- rab ----*/
#rab  {width:1200px; margin:auto; position: relative; height:1000px; opacity: 0; margin-top:200px;}
#rab dl.rocation {width:800px; height:160px; background:#f5f5f5; position: absolute; top:310px; left:50%; margin-left:-400px; border:1px solid #e5e5e5}
#rab dt {float:left; width:300px; height:100px; border-right:1px solid RGBA(0,0,0,0.3); text-align: center; font-size:25px; font-family: "nanumB"; line-height: 100px; margin-top:35px; margin-left:30px; margin-right:50px;}
#rab dd  {margin-top:35px; line-height: 25px;}
#rab dd h1,h2 {font-size:14px;}
#rab dd span {font-family: "nanumR"; font-size:14px; }
#rab dl:nth-of-type(2) {width:1200px; height:150px; margin:auto; margin-top:200px; border-bottom:1px solid #e6e6e6;}
#rab dl:nth-of-type(2) dt {margin:0; width:100px; height:100px; float:left; margin-right:40px;}
#rab dl:nth-of-type(2) dt img {width:130px;}
#rab dl:nth-of-type(2) dd {float:left; margin-top:25px;}
#rab dl:nth-of-type(2) dd h1 {color:#444; font-size:20px; margin-bottom:20px;}
#rab dl:nth-of-type(2) dd h2 {color:#444;}
#rab dl:nth-of-type(2) dd h2 span {background:#004c98; color:white; border-radius: 5px; margin-right:20px; display:inline-block; width:70px; text-align: center;}
#rab dl:nth-of-type(3) {width:1200px; height:150px; margin:auto; margin-top:20px;}
#rab dl:nth-of-type(3) dt {margin:0; width:100px; height:100px; float:left; margin-right:40px;}
#rab dl:nth-of-type(3) dt img {width:130px;}
#rab dl:nth-of-type(3) dd {float:left; margin-top:25px;}
#rab dl:nth-of-type(3) dd h1 {color:#444; font-size:20px; margin-bottom:20px;}
#rab dl:nth-of-type(3) dd h2 {color:#444;}
#rab dl:nth-of-type(3) dd h2 span {background:#8abd32; color:white; border-radius: 5px; margin-right:20px; display:inline-block; width:70px; text-align: center;}


/*---- tablet ----*/
@media(min-width:601px) and (max-width:1199px) {
    
    #content {min-width:600px; padding:50px 0;}
    #content h1 {font-size:25px;}
    #content h2 {font-size:14px; margin-bottom:30px;}
    
    #head_office {width:calc(100% - 20px); height:auto; padding:10px;}
    #head_office iframe {width:100%;}
    #head_office dl.rocation {width:90%; position:sticky; margin-left:0; left:0; top:0; margin:auto; background:none; border:none;}
    _:-ms-input-placeholder, :root #head_office dl.rocation {position: relative;}
    #head_office dt {width:100%; border-right:0; margin:0; line-height:none;}
    #head_office dd h1 {font-size:14px;}
    #head_office dd span {font-size:14px;}
    
    #rab {width:calc(100% - 20px); height:auto; padding:10px;}
    #rab iframe {width:100%;}
    #rab dl.rocation {width:90%; position:sticky; margin-left:0; left:0; top:0; margin:auto; background:none; border:none;}
    _:-ms-input-placeholder, :root #rab dl.rocation {position: relative;}
    #rab dt {width:100%; border-right:0; margin:0; line-height:none;}
    #rab dd h1 {font-size:14px;}
    #rab dd span {font-size:14px;}
    
}

/*---- mobile ----*/
@media(max-width:600px){
    
    #content {min-width:300px; height:100%; padding:50px 0; overflow: hidden;}
    #content h1 {font-size:25px;}
    #content h2 {font-size:14px; margin-bottom:30px;}
    
    #head_office {width:100%; min-width:300px; height:100%;}
    #head_office iframe {width:calc(100% - 40px); height:360px; padding:20px;}
    #head_office dl.rocation {width:90%; height:200px; position:sticky; margin-left:0; left:0; top:0; margin:auto; background:none; border:none;}
    _:-ms-input-placeholder, :root #head_office dl.rocation {position: relative;}
    #head_office dt {width:100%; border-right:0; margin:0; height:50px; line-height: 0;}
    #head_office dd h1 {font-size:13px;}
    #head_office dd span {font-size:13px;}
    
    #head_office dl:nth-of-type(2) {margin-top:0; width:90%; border-bottom:none;}
    #head_office dl:nth-of-type(2) dt {width:0; margin-right:0;}
    #head_office dl:nth-of-type(2) dd {width:100%;}
    #head_office dl:nth-of-type(2) dd h1 {text-align: center;}
    #head_office dl:nth-of-type(2) dd h2 {font-size:13px; overflow: hidden;}
    #head_office dl:nth-of-type(2) dd h2 span {margin-right:1%;}
    #head_office dl:nth-of-type(2) dd h2 b {width:74%; float:right;}
    #head_office dl:nth-of-type(2) dt img {display: none;}
    
    #head_office dl:nth-of-type(3) {margin-top:0; width:90%;}
    #head_office dl:nth-of-type(3) dt {width:0; margin-right:0;}
    #head_office dl:nth-of-type(3) dd {width:100%;}
    #head_office dl:nth-of-type(3) dd h1 {text-align: center;}
    #head_office dl:nth-of-type(3) dd h2 {font-size:13px;}
    #head_office dl:nth-of-type(3) dd h2 span {margin-right:1%;}
    #head_office dl:nth-of-type(3) dd h2 b {width:74%; float:right;}
    #head_office dl:nth-of-type(3) dt img {display: none;}
    
    
    #rab {width:100%; min-width:300px; height:100%;}
    #rab iframe {width:calc(100% - 40px); height:360px; padding:20px;}
    #rab dl.rocation {width:90%; height:200px; position:sticky; margin-left:0; left:0; top:0; margin:auto; background:none; border:none;}
    _:-ms-input-placeholder, :root #rab dl.rocation {position: relative;}
    #rab dt {width:100%; border-right:0; margin:0; height:50px; line-height: 0;}
    #rab dd h1 {font-size:13px;}
    #rab dd span {font-size:13px;}
    
    #rab dl:nth-of-type(2) {margin-top:0; width:90%; border-bottom:none;}
    #rab dl:nth-of-type(2) dt {width:0; margin-right:0;}
    #rab dl:nth-of-type(2) dd {width:100%;}
    #rab dl:nth-of-type(2) dd h1 {text-align: center;}
    #rab dl:nth-of-type(2) dd h2 {font-size:13px;}
    #rab dl:nth-of-type(2) dd h2 span {margin-right:1%;}
    #rab dl:nth-of-type(2) dd h2 b {width:74%; float:right;}
    #rab dl:nth-of-type(2) dt img {display: none;}
    
    #rab dl:nth-of-type(3) {margin-top:0; width:90%;}
    #rab dl:nth-of-type(3) dt {width:0; margin-right:0;}
    #rab dl:nth-of-type(3) dd {width:100%;}
    #rab dl:nth-of-type(3) dd h1 {text-align: center;}
    #rab dl:nth-of-type(3) dd h2 {font-size:13px;}
    #rab dl:nth-of-type(3) dd h2 span {margin-right:1%;}
    #rab dl:nth-of-type(3) dd h2 b {width:74%; float:right;}
    #rab dl:nth-of-type(3) dt img {display: none;}
}