@charset "UTF-8";

/*--------------------------------------------------------------
# リセットcss
--------------------------------------------------------------*/
/* Box sizingの定義 */
html {
	box-sizing: border-box;
}
*,
*:before,
*:after {
	box-sizing: inherit;
}

/* デフォルトのpaddingを削除 */
ul[class],
ol[class] {
  padding: 0;
}
 
/* デフォルトのmarginを削除 */
body,
h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
  margin: 0;
}
 
/* bodyのデフォルトを定義 */
body {
  scroll-behavior: smooth;
  text-rendering: optimizeSpeed;
}
 
/* class属性を持つul、ol要素のリストスタイルを削除 */
ul[class],
ol[class] {
  list-style: none;
}
 
/* img要素の扱いを簡単にする */
img {
  max-width: 100%;
  display: block;
}
 
/* article要素内の要素に自然な流れとリズムを定義 */
article > * + * {
  margin-top: 1em;
}
 
/* inputやbuttonなどのフォントは継承を定義 */
input,
button,
textarea,
select {
  font: inherit;
}
/*--------------------------------------------------------------
# 共通
--------------------------------------------------------------*/

img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
	object-fit: cover;
}
a {
	display: inline-block;
	opacity: 1;
	text-decoration: none;
	color: #fff;
}
a img {
	border-style: none;
}
a:visited {
	color: #fff;
}
a:hover {
	color: #0098a2;
}
a:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -moz-opacity: 0.4;
  -webkit-transition: 0.4s ease-in-out;
  -moz-transition: 0.4s ease-in-out;
  -o-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
}
ul,li {
	list-style: none;
}
/*--------------------------------------------------------------
# 基本選定（フォント、行間他）
--------------------------------------------------------------*/
html{
    font-size: 62.5%;
}
body,
header,
footer,
button,
input,
select,
optgroup,
textarea {
	font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	line-height: 2;
	-moz-font-feature-settings: "pkna";
 	-webkit-font-feature-settings: "pkna";
 	font-feature-settings: "pkna";
 	letter-spacing: 0.1px;
	font-variant-ligatures: no-common-ligatures;
	text-align: justify;
    vertical-align: baseline;
    background: transparent;
    font-size:1.6rem;/* 16px*/
    line-height: 2;
}
h1 {
    font-size: 36px;/* IE8以下とAndroid4.3以下用フォールバック */
    font-size: calc(2.4rem + ((1vw - 0.64rem) * 2.1429));/* 24px~36pxで可変*/
    line-height: 1.3;
}
h2 {
    font-size: 24px;/* IE8以下とAndroid4.3以下用フォールバック */
    font-size: calc(2rem + ((1vw - 0.64rem) * 0.7143));/* 20px~24pxで可変*/
    line-height: 1.3;
}
/*フォントサイズ見出し（スマホ用）CSS*/
@media screen and (max-width:559px){
    h1{
        font-size: 2.4rem;/* 24px*/
    }
    h2 {
        font-size: 2rem;/* 20px*/
    }
}
/*フォントサイズ見出し（タブレット用）CSS*/
@media screen and (min-width:560px) and (max-width:959px){
    h1{
        font-size: 2.4rem;/* 24px*/
    }
    h2 {
        font-size: 2rem;/* 20px*/
    }
}
/*フォントサイズ見出し（PC用）CSS*/
@media screen and (min-width:960px){
    h1 {
        font-size: 3.6rem;/* 36px*/
    }
    h2 {
        font-size: 2.4rem;/* 24px*/
    }
}
/*改行位置調整（スマホ用）CSS*/
@media screen and (max-width:559px){
.br-pc {
	display: none;
}
.br-sp {
	display: block;
	line-height: initial;
}
}
/*改行位置調整（タブレット用）CSS*/
@media screen and (min-width:560px) and (max-width:959px){
.br-pc {
	display: none;
}
.br-sp {
	display: block;
	line-height: initial;
}
}
/*改行位置調整（PC用）CSS*/
@media screen and (min-width:960px){
.br-pc {
	display: block;
	line-height: initial;
}
.br-sp {
	display: none;
}
}
/*フロート後のクリアCSS*/
.clearfix:after {
	display: block;
	clear: both;
	content: "";
}
/*--------------------------------------------------------------
# ヘッダー部分調整
--------------------------------------------------------------*/
/*ヘッダー全画面背景CSS*/
.container {
    background: url(../../assets/images/top_bg.png) no-repeat center;
    background-size: cover;
    height: 100vh;
}
/*ヘッダーロゴ・グローバルナビ位置調整CSS*/
#header .header-inner {
    max-width: 1000px;
    margin: 0 auto;
    overflow: hidden;
}
#header .logo {
    float: left;
    margin-left: 3%;
    margin-top: 1%;
}
#header .logo img {
    width: 90%;
}
/*ヘッダーロゴ・グローバルナビ装飾CSS*/
#header .header-nav {
    float: right;
    margin-right: 3%;
    margin-top: 2%;
}
#header .header-nav ul {
    display: flex;
    flex-direction: row;
}
#header nav.global-nav ul li {
    font-size: 1.6rem;
    line-height: 1;
    padding-right: 10px;
}
#header nav.global-nav ul li a {
    text-shadow: 1px 1px 2px #0098a2;
}
#header nav.global-nav ul li a:hover {
    text-shadow: none;
}
#header nav.global-nav ul li + li {
    border-left: 1px solid #fff;
    padding-left: 10px;
}
/*グローバルナビ(スマホ用)CSS*/
@media screen and (max-width:559px){
#header .logo {
    float: none;
    margin-left: 0;
    text-align: center;
}
#header .logo img {
    width: 80%;
}
#header .header-nav {
    float: none;
    margin-right: 0;
    margin-top: 2%;
    margin-bottom: 5%;
    width: 100%;
    background-color: rgba( 255, 255, 255, 0.45 );
    padding-top: 3px;
    padding-bottom: 3px;
}
#header .header-nav ul {
    display: flex;
    flex-direction: row;
}
#header nav.global-nav ul li {
    font-size: 1.4rem;
    line-height: 1;
    padding: 0 1rem;    
    text-align: center;
    }
#header nav.global-nav ul li + li {
    border-left: none;
    }
}
/*グローバルナビ(タブレット用)CSS*/
@media screen and (min-width:560px) and (max-width:959px){
}

/*グループメインキャッチコピー*/
#header .group-vision {
    max-width: 540px;
    margin: 3% auto 0 auto;
    color: #fff;
}
#header .group-vision p.group-caption {
    text-align: center;
    margin-bottom: 5%;
    font-size: 2.2rem;
    font-family: 'Noto Serif JP', serif;
    line-height: 1.6;
 	letter-spacing: 0.5rem;
    text-shadow: 1.5px 1.5px 2px #111;
}
/*--------------------------------------------------------------
# コンテンツ（メインナビ・お知らせ）
--------------------------------------------------------------*/
/*メインナビメニュー*/
.wrapper-nav {
    max-width: 660px;
    margin: 5% auto;
}
.wrapper-nav ul {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}
.wrapper-nav ul li {
    width: 160px;
    background: #bae8dc;
    text-align: center;
    line-height: 1;
    padding-top: 1rem;
    padding-bottom: 1rem;
    box-shadow: 1px 1px 4px #003a54;
}
.wrapper-nav ul li a {
    width: 160px;
    color: #003a54;
    text-align: center;
}
.wrapper-nav ul li:nth-child(2) {
    width: 200px;
}
.wrapper-nav span.nav-en {
    font-family: 'Titillium Web', sans-serif;
    font-size: 2.4rem;
    line-height: 1.4;
    padding-bottom: 0.8rem;
}
.wrapper-nav span.nav-jp {
    font-size: 1.4rem;
}
/*メインナビ(スマホ用)CSS*/
@media screen and (max-width:559px){
.wrapper-nav {
    width: 100%;
    padding: 10%;
	margin-bottom: 40px;
}
.wrapper-nav ul {
    display:inline-block;
    width: 100%;
}
.wrapper-nav ul li {
    width: 100%;
    padding: 20px;
	margin-bottom: 14px;
    background: #bae8dc;
    text-align: center;
    border-radius: 4px;
}
.wrapper-nav ul li a {
    width: 100%;
    color: #003a54;
    text-align: center;
}
.wrapper-nav ul li:nth-child(2) {
    width: 100%;
}
.wrapper-nav p.nav-en {
    font-family: 'Titillium Web', sans-serif;
    font-size: 2.4rem;
    line-height: 1.3;
    padding-top: 1rem;
}
.wrapper-nav p.nav-jp {
    font-size: 1.4rem;
    line-height: 1.5;
    padding-bottom: 0.5rem;
}
}
/*ニュースエリア*/
.wrapper-news {
    max-width: 500px;
    margin: 0 auto 60px auto;
    font-size: 1.4rem;
    line-height: 1.5;
}
.newstitle-inner {
    margin-bottom: 1.5rem;
    font-family: 'Titillium Web', sans-serif;
    color: #0098a2;
    text-align: center;
    font-size:2.6rem;
}
.newstitle-inner p span.news-title-jp {
    font-size:1.4rem;
    padding-left: 4px;
}
.newstext-inner {
    border: 1px solid #bae8dc;
    padding: 4% 6% ;

}
.news-title-jp {
    font-size: 10px;
}
.newstext-inner dl dt {
    font-weight: bold;
    font-size: 1.6rem;
    color: #003a54;
}
.newstext-inner dl dd {
    margin-bottom: 3%;
}
/*ニュースエリア（スマホ）CSS*/
@media screen and (max-width:559px){
.newstext-inner {
    border-left: none;
 	border-right: none;
}
}
/*--------------------------------------------------------------
# フッター部分調整
--------------------------------------------------------------*/
/*フッター*/
.footer {
    border-top:1px solid #999;
    margin-top: 5%;
}
.footerContents {
    max-width: 840px;
    margin: 0 auto;
}
.enterprise-detail {
    display: flex;
}
.enterprise-detail p {
    margin-right: 2%;
    font-size: 1.4rem;
}
.enterprise-detail p.name {
    font-size: 2.0rem;
    font-weight: bold;
}
.enterprise-detail p.address, 
.enterprise-detail p.tel-fax {
    padding-top: 8px;
}
/*フッター(スマホ用)CSS*/
@media screen and (max-width:559px){
.footer {
    padding: 5%;
    border-top:none;
    margin-top: 5%;
}
.footerContents {
    max-width: 100%;
}
.enterprise-detail {
    display: inline-block;
}
.enterprise-detail p {
    margin-right: 0;
    font-size: 1.4rem;
    line-height: 1.5;
    text-align: center;
}
.enterprise-detail p.name {
    font-size: 2.0rem;
    font-weight: bold;
    margin-bottom: 5px;
}
.enterprise-detail p.address, 
.enterprise-detail p.tel-fax {
    padding-top: 0px;
}
}