/*---------------Header---------------*/
.title-header{background: url(../images/img1.jpg) center no-repeat;}



.sub-title { display: block; padding: 4px 0;}
.sub-title h2 { font-weight: bold; font-size: 20px; position: relative; padding: 10px 0;}
.sub-title .line-title { position: relative; width: 50px; height: 1px; background: #000; display: inline-block; top: -6px; }
.sub-title small { font-weight: normal; font-size: 14px;} 


/* Message */
.column-2 { display: flex; flex-wrap: wrap; }
.column-left { display: block; width: 50%;}
.column-right { display: block; width: 50%;}

.text-content { line-height: 1.8; padding: 0 2%; }
.text-content h2 { color:#606060; font-size: 20px; font-weight: bold; margin-bottom: 8px; }

img.full-img { width: 100%; }

/* profile */

.profile{overflow: hidden;}
.profile { display: flex; flex-wrap: wrap; justify-content: space-between;}
.profile li{display:flex;flex-wrap: wrap;float: left;width: 49%;border: 1px solid #000;border-top: none;}
.profile li:nth-child(1),.profile li:nth-child(2){border-top: 1px solid #000;}

.profile li div{display: inline-block; width: 50%; padding: 12px 5px;  }
.profile li div:first-child{background: #f7f7f7;  border-right: 0; text-align: center; width: 30%; }
.profile li div:last-child{ border-left: 0; width: 70%; }

.company-profile { display: flex; flex-wrap: wrap; justify-content: space-between;}


/*  line  */
.line-black { display: block; width: 100%; height: 2px; background: #000; margin: 40px auto;}


/* access  */
.box-access { display:block; width: 100%; padding:30px 12%; border:1px solid #000;}

.column .line-black { display: block; width: 50px; height: 2px; background:#000; margin: 20px 0px;}

.location figure img, .tel figure img{padding: 10px 0;}
.location figure small{padding: 0px 14px;}
.location small b{font-weight: bold;}

.tel figure a{padding: 0px 14px;font-size: 18px;}
.tel a{font-weight: bold;}

.list-button { display: block; }
.list-button li { display: inline-block; background: #f6f6f6; padding: 6px 12px; border-bottom: 1px solid #000; margin: 8px; }

/* 3 images */
.column-3 { display: flex; flex-wrap: wrap; margin: 20px -2% 20px 0; }
.column-3 .column { display: block; width: 31.33%; margin: 14px 2% 0 0; }

/* map */
.map { margin-top: 40px; }



@media(max-width:768px) {

 .sub-title{padding: 0px 0 5px 0;}
 .sub-title h2{padding: 0px 0 5px;}

 .text-content h2 { font-size: 18px;}

 .profile {display: flex;width: 100%; margin: 8px auto;}
 .profile li{width: 100%;}

 .no-pc{display:none !important;}
 
}

@media (max-width: 690px) {

.column-left { width: 100%; padding: 0 2%; margin: 2px auto; }
.column-left .text-content { padding: 0; }

.column-right { width: 100%; padding: 0 2%; margin: 2px auto; text-align: center; }
.column-right .full-img { width: auto; max-width: 100%;}

.box-access{margin: 0px auto;}
.text-content h2{
font-size: 19px !important;
}
.box-access h2{
  font-size: 20px !important;
}


}


@media(max-width:580px) {

  .column-3{margin: 0px auto;}
  .column-3 .column { width: 100%; display: block; text-align: center; margin: 5px auto;}

}


@media(max-width:420px){

.column-2 .column-left .text-content h2{font-size: 13px;}
.column-2 .column-left .text-content p{font-size: 12px;}

.column h2{font-size: 13px;}

.company-profile li div{font-size: 12px;}

.box-access{padding: 30px 14px;}

.location small,.location small b{font-size: 12px;}

.tel figure a{font-size: 12px;}

.list-button li{font-size: 12px;}
.text-content h2 { font-size: 18px;}


}