@charset "UTF-8";

/*==========================================================
0. Initialize
===========================================================*/
/* box-sizing
----------------------------------------------------------*/
*, *:before, *:after{
box-sizing: border-box;
}

/* html:root要素
----------------------------------------------------------*/
/* iPhoneの縦横切替でfont-size変更無し */
html {
overflow-y:scroll; /* 縦スクロールバーを表示 */
font-size:100%;
-webkit-text-size-adjust:100%; /* iOS */
-ms-text-size-adjust:100%; /* iOS */
}

/* body: ベースフォント指定
----------------------------------------------------------*/
body{
position:relative;
font-family:'Lato', 'Noto Sans JP', -apple-system, BlinkMacSystemFont, arial, "Helvetica Neue", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
/*
font-family:-apple-system, BlinkMacSystemFont, arial, "Helvetica Neue", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
*/
font-size:100%;
color:#363026;
}
@media screen and (max-width:480px){
  body{}
}

/* Whole Wrapper
----------------------------------------------------------*/
#whole_wrapper{
position:relative;
overflow:hidden;
/*
min-width:980px;
*/
}

@media screen and (max-width:480px){
  #whole_wrapper{
/*
  min-width:auto;
  min-width:initial;
  min-width:720px;
*/
  }
}


/* Font Family ----------------*/
.mincho{
font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif;
}

.wf-notosans{
font-family:'Noto Sans JP', sans-serif;
}

.wf-sawarabimincho{
font-family:"Sawarabi Mincho";
}

.wf_lato{
font-family:'Lato', sans-serif;
}

.wf_Montserrat{
font-family: 'Montserrat', sans-serif;
}

.monotype{
font-family:Consolas, 'Courier New', Courier, Monaco, monospace;
}


/* リンク
----------------------------------------------------------*/
a{
color:#001489;
text-decoration:none;
}
a:hover{text-decoration:underline;}
@media screen and (max-width:480px) {
  a:hover{text-decoration:none;}
}

/* インライン要素
----------------------------------------------------------*/
em{
font-style:normal;
color:#001489;
}

/* Image
----------------------------------------------------------*/
img{
vertical-align:bottom;
max-width:100%;
}


/*==========================================================
1. Common / Module
===========================================================*/
/* clearfix
-----------------------------------------------------------*/
.clearfix:after{
content:" ";
display:block;
clear:both;
}

/* Letter Spacing
-----------------------------------------------------------*/
.ls01{letter-spacing:0.1em;}
.ls03{letter-spacing:0.3em;}
.ls05{letter-spacing:0.5em;}
.ls10{letter-spacing:1.0em;}


/* Font Color
-----------------------------------------------------------*/
.fc_xxxxx{}

/* Font Weight
-----------------------------------------------------------*/
.fweigh100{
font-weight:100;
}
.fweigh300{
font-weight:300;
}
.fweigh400{
font-weight:400;
}
.fweigh500{
font-weight:500;
}
.fweigh600{
font-weight:600;
}
.fweigh700{
font-weight:700;
}
.fweigh900{
font-weight:900;
}

/* Line Height
-----------------------------------------------------------*/
.lh15{line-height:1.5;}
.lh17{line-height:1.7;}
.lh20{line-height:2.0;}

/* Text Align
-----------------------------------------------------------*/
.talign_l{text-align:left;}
.talign_r{text-align:right;}
.talign_c{text-align:center;}

/* Float
-----------------------------------------------------------*/
.flt_l{float:left;}
.flt_r{float:right;}

.fltpc_l{float:left;}
.fltpc_r{float:right;}
@media screen and (max-width:480px) {
  .fltpc_l,.fltpc_r{float:none;}
}

/* Margin
-----------------------------------------------------------*/
.mb_10{margin-bottom:10px!important;}
.mb_20{margin-bottom:20px!important;}
.mb_30{margin-bottom:30px!important;}
.mb_40{margin-bottom:40px!important;}
.mb_50{margin-bottom:50px!important;}
.mb_60{margin-bottom:60px!important;}
.mb_70{margin-bottom:70px!important;}
.mb_80{margin-bottom:80px!important;}
.mb_90{margin-bottom:90px!important;}

/* Hover Image
-----------------------------------------------------------*/
a:hover img{
filter: alpha(opacity=80);
-moz-opacity:0.80;
opacity:0.80;
}

/* BR
-----------------------------------------------------------*/
.br_sp{display:none;}
@media screen and (max-width:480px) {
  .br_sp{display:inline;}
}

.br_pc{}
@media screen and (max-width:480px) {
  .br_pc{display:none;}
}

/* Hidden
-----------------------------------------------------------*/
.hdn_all{display:none;}

.hdn_pci{display:none;}
@media screen and (max-width:480px) {
  .hdn_pci{display:inline;}
}
.hdn_pcb{display:none;}
@media screen and (max-width:480px) {
  .hdn_pcb{display:block;}
}
.hdn_sp{}
@media screen and (max-width:480px) {
  .hdn_sp{display:none;}
}

/* Color Scheme
-----------------------------------------------------------*/
.color_base{
color:#c90915;
}

.color_dark01{
color:#2c72b3;
}

.color_dark02{
color:#165c9d;
}


/* スクロールアニメーション
-----------------------------------------------------------*/
.animate{
visibility:hidden;
}



/*==========================================================
2. Gloval Header
===========================================================*/
#g_header{}

@media screen and (max-width:480px) {
  #g_header{}
}

#g_header header{}

@media screen and (max-width:480px){
  #g_header header{}
}

/* Gloval Navigation ---------------------------*/
#gh_nav{}

@media screen and (max-width:480px){
  #gh_nav{}
}



/*==========================================================
3. Gloval Footer
===========================================================*/
#g_footer{
padding:20px 0;
border-top:1px solid #cccccc;
}

#g_footer footer{
margin:0 auto;
width:1024px;
}

@media screen and (max-width:480px){
  #g_footer{
  padding:10px 0;
  }

  #g_footer footer{
  width:100%;
  }
}


#gf_address{
display:table;
margin:0 auto 20px;
font-size:100%;
line-height:1.3;
}

@media screen and (max-width:480px){
  #gf_address{
  display:table;
  margin:0 auto 20px;
  font-size:88%;
  text-align:center;
  }
}

#gf_address p{
text-align:center;
}

#gf_copyright{
font-size:100%;
text-align:center;
}

@media screen and (max-width:480px){
  #gf_copyright{
  font-size:88%;
  }
}



/*==========================================================
4. HERO Area
===========================================================*/
#top_hero{}

#top_hero_inner{
display:table;
width:100%;
min-width:1024px;
/*
display: flex;
justify-content: space-between;

min-width:1280px;
outline:1px solid #00f000;
*/
}

@media screen and (max-width:480px){
  #top_hero_inner{
  display:block;
  width:100%;
  min-width:initial;
  min-width:auto;
  }
}


#top_hero_inner > div{
display:table-cell;
/*
vertical-align:middle;
*/
padding:40% 0 0 0;
width:50%;

/*
height:40vw;
outline:1px solid #0000f0;
*/
text-align:center;

}

@media screen and (max-width:480px){
  #top_hero_inner > div{
  display:block;
  padding:0;
  width:100%;
  }
}


#main_visual{
background-image:url(../../img/mv.gif);
background-repeat:no-repeat;
background-position:50%;
background-size:100% auto;
}

@media screen and (max-width:480px){
  #main_visual{
  display:none;
  }
}


#main_ttl_box{
position:relative;
vertical-align:top;
padding-top:10%!important;
}

@media screen and (max-width:480px){
  #main_ttl_box{
  position:relative;
  vertical-align:top;
  padding-top:0!important;
  }
}


#main_ttl_box_inner{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
padding-top:15%;
background-image: radial-gradient(#e70618 0, #db0719 40%, #af0f22 100%)
}

@media screen and (max-width:480px){
  #main_ttl_box_inner{
  position:relative;
  padding-top:15%;
  }
}

#logo_tgc{
padding-bottom:10%;
}
#logo_tgc img{
width:20%;
height:auto;
}

#main_ttl{
margin-bottom:7%;
}
#main_ttl img{
width:90%;
height:auto;
}

#info_exhib{
font-size:113%;
line-height:1.2;
color:#ffffff;
}

@media screen and (max-width:480px){
  #info_exhib{
  padding-bottom:20%;
  font-size:113%;
  line-height:1.2;
  color:#ffffff;
  }
}


#en_ttl{
position:absolute;
bottom:3%;
left:0;
right:0;
margin:0 auto;
font-size:113%;
font-weight:400;
color:#ffffff;
}

@media screen and (max-width:480px){
  #en_ttl{
  font-size:100%;
  }
}



/*==========================================================
5. メインコンテンツ
===========================================================*/
#main_contents_wrapper{
position:relative;

/*
padding-bottom:70px;
*/
}

#main_contents{}


/* 汎用部品
---------------------------------------------------------*/
/* mcunit ------------------------------*/
.mcunit_wrapper{}

.mcunit{
margin:0 auto;
padding:0 12px;
width:1024px;

/*
width:1000px;
outline:1px solid #00f000;
*/
}

@media screen and (max-width:480px){
  .mcunit{
  padding:0 20px;
  width:100%;
  }
}




/* mc01
---------------------------------------------------------*/
#mc01{}

#mc01 .mcunit{
padding:50px 12px 70px;
}

@media screen and (max-width:480px){
  #mc01 .mcunit{
  padding:30px 20px 30px;
  }
}


#mc01_01{
display:table;
width:100%;
}

@media screen and (max-width:480px){
  #mc01_01{
  display:block;
  }
}


#mc01_01 h2{
display:table-cell;
vertical-align:middle;
font-size:250%;
font-weight:600;
line-height:1.4;
}

@media screen and (max-width:480px){
  #mc01_01 h2{
  display:block;
  margin-bottom:20px;
  text-align:center;
  }
}


#mc01_01 p{
display:table-cell;
vertical-align:middle;

font-size:113%;
font-weight:400;
line-height:1.7;
}

@media screen and (max-width:480px){
  #mc01_01 p{
  display:block;
  }
}


/* mc02
---------------------------------------------------------*/
#mc02{
padding:50px 0;
background-color:#f0f0f0;
}

@media screen and (max-width:480px){
  #mc02{
  padding:30px 0;
  }
}


#mc02 h2{
margin-bottom:20px;
font-size:150%;
font-weight:500;
}

#mc02 p{
margin-bottom:30px;
font-size:113%;
line-height:1.4;

}

#mc02_workslist{}

#mc02_workslist ul{}

#mc02_workslist ul > li{
float:left;
padding:5px;
width:25%;
background-color:#ffffff;
}

@media screen and (max-width:480px){
  #mc02_workslist ul > li{
  width:50%;
  }
}


.icn_zoom{
display:none!important;
}



/* mc03
---------------------------------------------------------*/
#mc03{
padding:30px 0;
}

#info_box{
float:left;
width:55%;
}

@media screen and (max-width:480px){
  #info_box{
  float:none;
  width:100%;
  margin-bottom:20px;
  }
}


#info_box h2{
margin-bottom:20px;
font-size:150%;
font-weight:500;
}

#info_box dl{
font-size:113%;
line-height:1.4;
}

#info_box dl dt{
clear:both;
float:left;
width:3em;
font-weight:500;
}

#info_box dl dd{
padding-left:3.5em;
}

#info_box dl dd > span{
font-size:89%;
}

#mc03_gmaps{
float:right;
width:44%;
}

@media screen and (max-width:480px){
  #mc03_gmaps{
  float:none;
  width:100%;
  }
}


#mc03_gmaps iframe{
width:100%;
}