@charset "utf-8";
@font-face {font-family: Futura; src: url(../fonts/FuturaPTMedium.otf);}

.main > .tit {padding: 3rem 0; max-width: 1000px; position: relative;}
.main > .tit .titH3 {padding-top: 0; margin-bottom: 0;}
.main > .tit .btn {position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); right: 0;}
.main > .tit .btn a {padding: 1rem 2rem; border: 1px solid #000;}
.main > .tit .btn a:nth-of-type(1) {margin-right: 0.5rem;}

#box01 {text-align: center; padding: 0;}
#box01 .mainTxt {margin-bottom: 7rem;}
#box01 .link {margin-bottom: 3rem; line-height: 2;}
#box01 .link a {text-decoration: underline;}
#box01 .link:last-of-type {margin-bottom: 0;}

#box01 ul {margin: 6rem 0 7rem;}
#box01 ul li {width: 33%;}
#box01 ul li a {display: block; position: relative; overflow: hidden; letter-spacing: 0.1rem;}
#box01 ul li a .txt {position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; color: #fff; z-index: 9; text-align: center; text-shadow: #000 0px 0px 5px;}
#box01 ul li a .txt p:nth-of-type(1) {font-size: 3.4rem; font-family: 'Futura', sans-serif; font-weight: 300; line-height: 1; margin-bottom: 0.5rem;}
#box01 ul li:hover a:after {background: rgba(0, 0, 0, 0.2);}
#box01 ul li img {transition: transform .5s ease;}
#box01 ul li:hover img {transform: scale(1.1);}
#box01 .caption {font-size: 1rem;}

/* new design */
.form_btn a{
  position: relative;
}
.main > .tit .btn a.form_btn_bg{
  padding: 0.8rem 5rem 1.6rem;
}
.form_btn_en{
  position: absolute;
  bottom:0.8rem;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  color:#888;
  font-size:1.1rem;
  text-align: center;
  width:100%;
  pointer-events: none;
}
/*Responsive*/
@media only screen and (max-width: 1080px){
  #box01 ul li a .txt p:nth-of-type(1) {font-size: 2.8rem;}
}

@media only screen and (max-width: 767px){
  .main > .tit .titH3 {margin-bottom: 2rem;}
  .main > .tit .btn {position: static; transform: translateY(0); -webkit-transform: translateY(0); text-align: center;}
  .main > .tit .btn a {min-width: 130px; padding: 1rem 0; text-align: center;}

  #box01 .mainTxt {text-align: left; margin-bottom: 4rem;}
  #box01 .mainTxt p:nth-of-type(1) {margin-bottom: 2rem;}
}

@media only screen and (max-width: 480px){
  #box01 ul li {width: 100%; max-width: 462px; margin: 0 auto 20px;}
  #box01 ul li:last-of-type {margin-bottom: 0;}
}
