@charset "utf-8";

/*
common
main,mainimg
title(.tit)
message
principal
portfolio
news
contact
modules
*/

/***************
common
***************/

/*fade in*/

.fade-in {
	opacity: 0;
	-webkit-transform: translate(0, 40px);
	transform: translate(0, 40px);
	-webkit-transition: transform 1s,opacity 1s;
	transition: transform 1s,opacity 1s;
}
.fade-in.scroll-in{
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

/***************
main,mainimg
***************/
#main *{
  box-sizing: border-box;
}
#main{
  z-index: 1;
  position: relative;
}
#mainimg{
  position: relative;
  width: 100%;
  height: 280vh;
  overflow: hidden;
}
#mainimg .item{
  width: 100%;
  height: 100vh;
}
#mainimg .main_bg{
  position: fixed;
  z-index: -1;
  width: 100%;
  top: 0;
  left: 0;
  background-color: #000;
  background-size: cover;
  background-position: center center;
}
#mainimg .item1{
  position: relative;
}
#mainimg .item2{
  position: fixed;
  top: 0;
  left: 0;
}
#mainimg .item .wrap{
  position: absolute;
  width: 100%;
  text-align: center;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  z-index: 80;
}
#mainimg .item h1{
  font-family:'SuzukiPROHeadline';
  color: #fff;
}
#mainimg .item h1.fade-in{
	-webkit-transition: transform 1s .3s,opacity 2s .3s;
	transition: transform 1s .3s,opacity 2s .3s;
}
#mainimg .item h1 span{
  display: block;
  white-space: normal;
}
#mainimg .item h1 span.fade-in{
  -webkit-transition-delay: .5s;
  transition-delay: .5s;
}
#mainimg .item1 .wrap{
  opacity: 1;
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
}
#mainimg .item2 .main_bg{
  opacity: 0;
  -webkit-transition: opacity 1.5s;
  transition: opacity 1.5s;
}
#mainimg .item2 .main_bg.active{
  opacity: 1;
}
#mainimg .item2 h1 {
	opacity: 0;
	-webkit-transform: translate(0, 40px);
	transform: translate(0, 40px);
	-webkit-transition: transform 1s,opacity 1s;
	transition: transform 1s,opacity 1s;
}
#mainimg .item2 h1.scroll-in {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}
@media print, screen and (min-width: 751px) {
#mainimg .item1 .main_bg{
  background-image: url("/home/img/mainimg01_pc.jpg");
}
#mainimg .item2 .main_bg{
  background-image: url("/home/img/mainimg02_pc.jpg");
}
#mainimg .item h1{
  margin-left: 20px;
  margin-right: 20px;
  font-size: 11rem;
  line-height: 1;
}
#mainimg .item h1 span{
  font-size: 4.6rem;
  margin-top: 30px;
}
#main section > .wrap{
  box-sizing: border-box;
  max-width: 860px;
  padding-top:100px;
  padding-bottom: 120px;
  padding-left: 20px;
  padding-right: 20px;
  margin-left: auto;
  margin-right: auto;
}
}

@media screen and (max-width: 750px) {
#mainimg .item{
  height: 100vh;
}
#mainimg .main_bg{
  height: 100vh;
}
#mainimg .item .wrap{
  padding-left: 2.67vw;
  padding-right:  2.67vw;
}
#mainimg .item1 .main_bg{
  background-image: url("/home/img/mainimg01_sp.jpg");
}
#mainimg .item1.landscape .main_bg{
  background-image: url("/home/img/mainimg01_02_sp.jpg");
}
#mainimg .item2 .main_bg{
  background-image: url("/home/img/mainimg02_sp.jpg");
}
#mainimg .item2.landscape .main_bg{
  background-image: url("/home/img/mainimg02_02_sp.jpg");
}
#mainimg .item h1{
  font-size: 4.5rem;
  line-height: 1;
}
#mainimg .item h1 span{
  font-size: 2.1rem;
  margin-top: 3vw;
}
#mainimg .item h1{
}
section > .wrap{
  box-sizing: border-box;
  padding-top:13.33vw;
  padding-bottom: 8vw;
  padding-left: 2.67vw;
  padding-right: 2.67vw;
}
}
@media screen and (max-width: 350px) {
#mainimg .item h1{
  font-size: 4rem;
}
}

/***************
title(.tit)
***************/
.tit1{
  text-align: center;
  line-height: 1.3;
  font-family: 'SuzukiPROHeadline';
}
.tit2{
  text-align: center;
  font-weight: 700;
}
@media print, screen and (min-width: 751px) {
.tit1{
  margin-bottom: 53px;
  font-size: 4.8rem;
}
.tit2{
  font-size: 2.4rem;
}
.tit1 + .tit2{
  padding-bottom: 60px;
}
}

@media screen and (max-width: 750px) {
.tit1{
  margin-bottom: 5.73vw;
  font-size: 2.4rem;
}
.tit2{
  font-size: 1.8rem;
}
.tit1 + .tit2{
  margin-bottom: 6.67vw;
}
}
/***************
message
***************/
#message{
  position: relative;
  background-image: url("/home/img/message_bg.jpg");
  background-repeat: repeat;
  background-size: 100px 100px;
}
#message .fade-in{
	-webkit-transition: transform 1.5s .5s,opacity 2s .5s;
	transition: transform 1.5s .5s,opacity 2s .5s;
}
#message .president.fade-in{
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
}
#message .president{
  position: absolute;
  bottom: 0;
}
@media print, screen and (min-width: 751px) {
#main section#message > .wrap {
  padding-bottom: 50px;
}
#message .inner{
  position: relative; 
}
#message .president{
  left: -124px;
  width: 368px;
}
#message .president-message{
  margin-left: 245px;
}
#message .caption{
  margin-top: 15px;
}
}
@media print, screen and (max-width: 910px) {
#message .president-message{
  margin-left: 265px;
}
#message .president{
  left: -104px;
}
}
@media screen and (max-width: 750px) {
#message{
  overflow: hidden;
}
#message .president{
  width: 69vw;
  left:-18vw;
  bottom: -10.67vw;
}
#message .president-message{
  margin-top: 5.33vw;
  margin-left: 0;
  margin-bottom: 47vw;
}
}
@media screen and (min-width: 533px) and (max-width: 750px) {
#message .president{
  max-width: 368px;
  left: -webkit-calc(-124px + 2.67vw);
  left: calc(-124px + 2.67vw);
  bottom: -50px;
}
#message .president-message{
  margin-bottom: -webkit-calc(295px - 8vw);
  margin-bottom: calc(295px - 8vw);
}
}
/***************
Principal Fields
***************/
#principal {
  background-color: #fff;
}
#principal .principal_box .item .txt p{
  line-height: 1.2;
  text-align: center;
}
@media print, screen and (min-width: 751px) {
#principal .principal_box .item{
  width: calc(25% - 15px);
  width: -webkit-calc(25% - 15px);
  margin-right: 20px;
  margin-top: 20px;
}
#principal .principal_box{
  margin-top:-20px;
}
#principal .principal_box .item:nth-child(4n){
  margin-right: 0;
}
#principal .principal_box .item .txt p{
  padding-right: 10px;
  padding-left: 10px;
  padding-top: 20px;
  padding-bottom: 20px;
}
}
@media screen and (max-width: 750px) {
#principal .principal_box{
  margin-top: -2.8%;
}
#principal .principal_box .item{
  width: 48.59%;
  margin-right: 2.8%;
  margin-top: 2.8%;
}
#principal .principal_box .item:nth-child(2n){
  margin-right: 0;
}
#principal .principal_box .item .txt p{
  padding-right: 1.33vw;
  padding-left: 1.33vw;
  padding-top: 5.33vw;
  padding-bottom: 5.33vw;
}
}
/***************
portfolio
***************/
#portfolio{
  background-color: #f2f2f2;
}
@media print, screen and (min-width: 751px) {
  #portfolio .portfolio_box{
    margin-top: -40px;
  }
#portfolio .portfolio_box .item{
  width: calc(33.333% - 26.667px);
  width: -webkit-calc(33.333% - 26.667px);
  margin-right: 40px;
  margin-top: 40px;
}
#portfolio .portfolio_box .item:nth-child(3n){
  margin-right: 0;
}
}
@media screen and (max-width: 750px) {
  #portfolio .portfolio_box{
    margin-top: -2.8%;
  }
#portfolio .portfolio_box .item{
  width: 48.59%;
  margin-right: 2.8%;
  margin-top: 2.8%;
}
#portfolio .portfolio_box .item:nth-child(2n){
  margin-right: 0;
}
}
/***************
news
***************/
#news {
  
  background-color: #fff;
  
/*  background-color: #f2f2f2;*/
}
#news .news_box{
  border-top: solid 1px #707070;
}
#news .news_box li{
  border-bottom: solid 1px #707070;
}
#news .news_box li a{
  display: block;
}
#news .news_box li a.blank .txt span::after{
  content: "";
  display: inline-block;
  margin-left: 5px;
  width: 10px;
  height: 10px;
  background-image: url("/common/img/icon_wd.svg");
  background-size: cover;
  background-repeat: no-repeat;
}
@media print, screen and (min-width: 751px) {
#news .news_box li a{
  padding-top: 15px;
  padding-bottom: 15px;
}
#news .news_box .date{
  padding-left: 10px;
}
#news .news_box .txt{
  margin-top: -1.7em;
  margin-left: 11em;
  display: block;
}
}
@media screen and (max-width: 750px) {
#news .news_box li a{
  padding-top: 2.67vw;
  padding-bottom: 2.67vw;
  padding-left: 2.67vw;
}
#news .news_box .txt{
  display: block;
}
}
/***************
more-btn
***************/
@media print, screen and (min-width: 751px) {
  #news .more-btn {
    width: 240px;
    margin-top: 40px;
    margin-right: auto;
    margin-left: auto;
  }
  #news .more-btn a {
    display: inline-block;
    width: 100%;
    text-align: center;
    font-size: 1.8rem;
    font-family: 'SuzukiPROHeadline';
    box-sizing: border-box;
    border: solid 1px #666666;
    padding: 0;
    line-height: 43px;
    transition: all 0.2s linear;
    background-image: url("/home/img/arrow2.svg");
    background-position: 20px center;
    background-repeat: no-repeat;
    background-size: 5px auto;
  }
  #news .more-btn a:hover {
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
  }
}
@media only screen and (max-width: 750px) {
  #news .more-btn {
    width: 240px;
    margin-top: 8vw;
    margin-right: auto;
    margin-left: auto;
  }
  #news .more-btn a {
    display: inline-block;
    width: 100%;
    text-align: center;
    font-size: 1.8rem;
    font-family: 'SuzukiPROHeadline';
    box-sizing: border-box;
    border: solid 1px #666666;
    padding: 0;
    line-height: 43px;
    transition: all 0.2s linear;
    background-image: url("/home/img/arrow2.svg");
    background-position: 20px center;
    background-repeat: no-repeat;
    background-size: 5px auto;
  }
  #news .more-btn a:hover {
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
  }
}
/***************
contact
***************/
#contact{
  
  background-color: #f2f2f2;
  
/*  background-color: #fff;*/
}
#contact .inner{
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
#contact .contact-mail a{
  display: inline-block;
  background-image: url("/home/img/icon_mail.png");
  background-position: left center;
  background-repeat: no-repeat;
  line-height: 1;
  font-weight: 700;
}
@media print, screen and (min-width: 751px) {
#main section#contact > .wrap {
  padding-bottom: 100px;
}
#contact h3{
  margin-bottom: 25px;
}
#contact h3 img{
  width: 413px;
}
#contact .contact-mail a{
  padding-left: 36px;
  background-size: 28px auto;
  background-position: left center;
  font-size: 3.0rem;
}
#contact .contact-notice{
  margin-top: 55px;
}
}
@media screen and (max-width: 750px) {
#contact h3{
  margin-bottom: 2.67vw;
}
#contact h3 img{
  width: 207px;
}
#contact .contact-mail a{
  padding-left: 18px;
  background-size: 14px auto;
  background-position: left center;
  font-size: 1.5rem;
}
#contact .contact-notice{
  margin-top: 5.33vw;
  text-align: left;
}
#contact .wrap{
  padding-bottom: 14.67vw;
}
}
@media screen and (max-width: 350px) {
   #contact .contact-mail a{
     font-size: 1.4rem;
  }
}

/***************
modules
***************/

/*margin padding*/
@media print, screen and (min-width: 751px) {
.mt0,
.mt0_pc {
	margin-top: 0 !important;
}
.mt5,
.mt5_pc {
	margin-top: 5px !important;
}
.mt10,
.mt10_pc {
	margin-top: 10px !important;
}
.mt15,
.mt15_pc {
	margin-top: 15px !important;
}
.mt20,
.mt20_pc {
	margin-top: 20px !important;
}
.mt25,
.mt25_pc {
	margin-top: 25px !important;
}
.mt30,
.mt30_pc {
	margin-top: 30px !important;
}
.mt35,
.mt35_pc {
	margin-top: 35px !important;
}
.mt40,
.mt40_pc {
	margin-top: 40px !important;
}
.mt45,
.mt45_pc {
	margin-top: 45px !important;
}
.mt50,
.mt50_pc {
	margin-top: 50px !important;
}
.mt55,
.mt55_pc {
	margin-top: 55px !important;
}
.mt60,
.mt60_pc {
	margin-top: 60px !important;
}
.mt65,
.mt65_pc {
	margin-top: 65px !important;
}
.mt70,
.mt70_pc {
	margin-top: 70px !important;
}
.mt75,
.mt75_pc {
	margin-top: 75px !important;
}
.mt80,
.mt80_pc {
	margin-top: 80px !important;
}
.mr0,
.mr0_pc {
	margin-right: 0 !important;
}
.mb10,
.mb10_pc {
	margin-bottom: 10px !important;
}
.ml,
.ml_pc {
	margin-left: 16px !important;
}
.mr,
.mr_pc {
	margin-right: 16px !important;
}
.pt0,
.pt0_pc {
	padding-top: 0px !important;
}
.pt5,
.pt5_pc {
	padding-top: 5px !important;
}
.pt10,
.pt10_pc {
	padding-top: 10px !important;
}
.pt15,
.pt15_pc {
	padding-top: 15px !important;
}
.pt20,
.pt20_pc {
	padding-top: 20px !important;
}
.pt25,
.pt25_pc {
	padding-top: 25px !important;
}
.pt30,
.pt30_pc {
	padding-top: 30px !important;
}
.pt35,
.pt35_pc {
	padding-top: 35px !important;
}
.pt40,
.pt40_pc {
	padding-top: 40px !important;
}
.pt45,
.pt45_pc {
	padding-top: 45px !important;
}
.pt50,
.pt50_pc {
	padding-top: 50px !important;
}
.pt55,
.pt55_pc {
	padding-top: 55px !important;
}
.pt60,
.pt60_pc {
	padding-top: 60px !important;
}
.pt65,
.pt65_pc {
	padding-top: 65px !important;
}
.pt70,
.pt70_pc {
	padding-top: 70px !important;
}
.pt75,
.pt75_pc {
	padding-top: 75px !important;
}
.pt80,
.pt80_pc {
	padding-top: 80px !important;
}
.pl1,
.pl1_pc {
	padding-left: 1em;
}
.pl1_5,
.pl1_5_pc {
	padding-left: 1.5em;
}
.pl2,
.pl2_pc {
	padding-left: 2em;
}
}
@media screen and (max-width: 750px) {
.mt0,
.mt0_sp {
	margin-top: 0 !important;
}
.mt5,
.mt5_sp {
	margin-top: 1.33vw !important;
}
.mt10,
.mt10_sp {
	margin-top: 2.66vw !important;
}
.mt15,
.mt15_sp {
	margin-top: 4vw !important;
}
.mt20,
.mt20_sp {
	margin-top: 5.33vw !important;
}
.mt25,
.mt25_sp {
	margin-top: 6.66vw !important;
}
.mt30,
.mt30_sp {
	margin-top: 8vw !important;
}
.mt35,
.mt35_sp {
	margin-top: 9.33vw !important;
}
.mt40,
.mt40_sp {
	margin-top: 10.66vw !important;
}
.mt45,
.mt45_sp {
	margin-top: 12vw !important;
}
.mt50,
.mt50_sp {
	margin-top: 13.33vw !important;
}
.mt55,
.mt55_sp {
	margin-top: 14.66vw !important;
}
.mt60,
.mt60_sp {
	margin-top: 16vw !important;
}
.mt65,
.mt65_sp {
	margin-top: 17.33vw !important;
}
.mt70,
.mt70_sp {
	margin-top: 18.66vw !important;
}
.mt75,
.mt75_sp {
	margin-top: 20vw !important;
}
.mt80,
.mt80_sp {
	margin-top: 21.33vw !important;
}
.mr0,
.mr0_sp {
	margin-right: 0 !important;
}
.mb10,
.mb10_sp {
	margin-bottom: 2.66vw !important;
}
.ml,
.ml_sp {
	margin-left: 2.26% !important;
}
.mr,
.mr_sp {
	margin-right: 2.26% !important;
}
.pt0,
.pt0_sp {
	padding-top: 0 !important;
}
.pt5,
.pt5_sp {
	padding-top: 1.33vw !important;
}
.pt10,
.pt10_sp {
	padding-top: 2.66vw !important;
}
.pt15,
.pt15_sp {
	padding-top: 4vw !important;
}
.pt20,
.pt20_sp {
	padding-top: 5.33vw !important;
}
.pt25,
.pt25_sp {
	padding-top: 6.66vw !important;
}
.pt30,
.pt30_sp {
	padding-top: 8vw !important;
}
.pt35,
.pt35_sp {
	padding-top: 9.33vw !important;
}
.pt40,
.pt40_sp {
	padding-top: 10.66vw !important;
}
.pt45,
.pt45_sp {
	padding-top: 12vw !important;
}
.pt50,
.pt50_sp {
	padding-top: 13.33vw !important;
}
.pt55,
.pt55_sp {
	padding-top: 14.66vw !important;
}
.pt60,
.pt60_sp {
	padding-top: 16vw !important;
}
.pt65,
.pt65_sp {
	padding-top: 17.33vw !important;
}
.pt70,
.pt70_sp {
	padding-top: 18.66vw !important;
}
.pt75,
.pt75_sp {
	padding-top: 20vw !important;
}
.pt80,
.pt80_sp {
	padding-top: 21.33vw !important;
}
.pl1,
.pl1_sp {
	padding-left: 1em;
}
.pl1_5,
.pl1_5_sp {
	padding-left: 1.5em;
}
.pl2,
.pl2_sp {
	padding-left: 2em;
}
}

/*column box*/
@media print, screen and (min-width: 751px) {
.box1_1,
.box1_1_pc {
	width: 100%;
	float: none;
	margin-right: 0;
}
.box2_1,
.box2_1_pc {
	width: calc(50% - 10px);
	width: -webkit-calc(50% - 10px);
	margin-right: 20px;
}
.box3_1,
.box3_1_pc {
	width: calc(33.333% - 13.333px);
	width: -webkit-calc(33.333% - 13.333px);
	margin-right: 20px;
}
.box3_2,
.box3_2_pc {
	width: calc(66.666% - 6.667px);
	width: -webkit-calc(66.666% - 6.667px);
	margin-right: 20px;
}
.box4_1,
.box4_1_pc {
	width: calc(25% - 15px);
	width: -webkit-calc(25% - 15px);
	margin-right: 20px;
}
.box4_3,
.box4_3_pc {
	width: calc(75% - 5px);
	width: -webkit-calc(75% - 5px);
	margin-right: 15px;
}
.row > .box2_1_pc:last-child,
.row_pc > .box2_1_pc:last-child,
.box > .box2_1_pc:last-child,
.box_pc > .box2_1_pc:last-child {
	margin-right: 0px;
}
.row > .box3_1_pc:last-child,
.row_pc > .box3_1_pc:last-child,
.box > .box3_1_pc:last-child,
.box_pc > .box3_1_pc:last-child {
	margin-right: 0px;
}
.row > .box3_2_pc:last-child,
.row_pc > .box3_2_pc:last-child,
.box > .box3_2_pc:last-child,
.box_pc > .box3_2_pc:last-child {
	margin-right: 0px;
}
.row > .box4_1_pc:last-child,
.row_pc > .box4_1_pc:last-child,
.box > .box4_1_pc:last-child,
.box_pc > .box4_1_pc:last-child {
	margin-right: 0px;
}
.row > .box4_3_pc:last-child,
.row_pc > .box4_3_pc:last-child,
.box > .box4_3_pc:last-child,
.box_pc > .box4_3_pc:last-child {
	margin-right: 0px;
}
.box > .box2_1_pc,
.box > .box3_1_pc,
.box > .box3_2_pc,
.box > .box4_1_pc,
.box > .box4_3_pc,
.box_pc > .box2_1_pc,
.box_pc > .box3_1_pc,
.box_pc > .box3_2_pc,
.box_pc > .box4_1_pc,
.box_pc > .box4_3_pc{
	float: left;
}
.float > .right,
.float > .right_pc{
	float:right !important;
}
.float > .no_float,
.float > .no_float_pc{
	float:none !important
}
.last,
.last_pc {
	margin-right: 0px !important;
}
.left,
.left_pc {
	float: left !important;
	margin-right: 0 !important;
}
.right,
.right_pc {
	float: right !important;
	margin-right: 0 !important;
}
}
@media screen and (max-width: 750px) {
.box1_1,
.box1_1_sp {
	width: 100%;
	margin-right: 0;
}
.box2_1,
.box2_1_sp {
  width: 48.59%;
  margin-right: 2.8%;
}
.box3_1,
.box3_1_sp {
  width: 31.46%;
  margin-right: 2.8%;
}
.box3_2,
.box3_2_sp {
	width: 45.74%;
	margin-right: 20px;
  margin-right: 2.8%;
}
.row > .box2_1_sp:last-child,
.row_sp > .box2_1_sp:last-child,
.box > .box2_1_sp:last-child,
.box_sp > .box2_1_sp:last-child {
	margin-right: 0px;
}
.row > .box3_1_sp:last-child,
.row_sp > .box3_1_sp:last-child,
.box > .box3_1_sp:last-child,
.box_sp > .box3_1_sp:last-child {
	margin-right: 0px;
}
.row > .box3_2_sp:last-child,
.row_sp > .box3_2_sp:last-child,
.box > .box3_2_sp:last-child,
.box_sp > .box3_2_sp:last-child {
	margin-right: 0px;
}
.row > .box4_1_sp:last-child,
.row_sp > .box4_1_sp:last-child,
.box > .box4_1_sp:last-child,
.box_sp > .box4_1_sp:last-child {
	margin-right: 0px;
}
.row > .box4_3_sp:last-child,
.row_sp > .box4_3_sp:last-child,
.box > .box4_3_sp:last-child,
.box_sp > .box4_3_sp:last-child {
	margin-right: 0px;
}
.box > .box2_1_sp,
.box > .box3_1_sp,
.box > .box3_2_sp,
.box_sp > .box2_1_sp,
.box_sp > .box3_1_sp,
.box_sp > .box3_2_sp{
	float: left;
}
.float > .right,
.float > .right_sp{
	float:right !important;
}
.float > .no_float,
.float > .no_float_sp{
	float:none !important
}
.last,
.last_sp {
	margin-right: 0px !important;
}
.left,
.left_sp {
	float: left !important;
	margin-right: 0 !important;
}
.right,
.right_sp {
	float: right !important;
	margin-right: 0 !important;
}
}
/*text*/
.txt_right {
	text-align: right;
}
.txt_center {
	text-align: center;
}
.txt_xl{
  font-size: 1.4em;
}
.txt_l{
  font-size: 1.2em;
}
.txt_s{
  font-size: 0.8em;
}
.txt_xs{
  font-size: 0.6em;
}
@media print, screen and (min-width: 751px) {
.text_right_pc {
	text-align: right;
}
.text_center_pc {
	text-align: center;
}
}
@media screen and (max-width: 750px) {
.text_right_sp {
	text-align: right;
}
.text_center_sp {
	text-align: center;
}
}