@charset "utf-8";
/*
=======================================
    Reset CSS
=======================================
*/

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
 margin: 0;
 padding: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section {
 display: block;
}

html {
 /* スマートフォンでの文字サイズ拡大防止 */
 -webkit-text-size-adjust: 100%;
 color: #162442;
 /*フォントサイズにremを使う場合はブラウザのデフォルトである16pxに対して62.5%を設定することが多い。そうするとベースが10pxとなって他の要素のフォントサイズの計算が簡単になる。(例)30pxにしたい場合は1.6remなど*/
 font-size: 62.5%;
 /* 文字詰め 「」。など */
 font-feature-settings: "palt" 1;
}

/* カラム落ちを防ぐため全ての要素でwidthのサイズの中にpaddingを含めるようにする */
* {
 box-sizing: border-box;
}
/* 擬似要素のbox-sizingは親要素の値を継承する */
*::before,
*::after {
 box-sizing: inherit;
}

body {
 /*スマホで横にすると文字の大きさが変わって崩れるのを防ぐ。bodyか文字サイズを調整したい要素に入れる*/
 -webkit-text-size-adjust: 100%;
 background-color: #fff;
 /* font-family: sans-serif; */
 font-size: 1.6rem;
 line-height: 1.8;
 font-family: a-otf-ud-shin-maru-go-pr6n, sans-serif;
 font-weight: 300;
 font-style: normal;
}
/* nav {
 font-weight: bold;
} */

/*画像のフルードイメージ化*/
img {
 border: 0;
 max-width: 100%;
 height: auto;
}

ul,
ol {
 list-style-type: none;
}
table {
 border-collapse: collapse;
 border-spacing: 0;
}
img,
input,
select,
textarea {
 vertical-align: middle;
}

button {
 margin: 0;
 padding: 0;
 border: 0;
 border-radius: 0;
 background: transparent;
 color: inherit;
 vertical-align: middle;
 text-align: inherit;
 font: inherit;
 -webkit-appearance: none;
 appearance: none;
}

a {
 color: #162442;
 transition: 0.5s;
 text-decoration: none;
}
/* a:hover {
 color: #81d87e;
} */

/* グロナビ */

.gnavi__wrap {
 width: 1200px;
 margin: 0 auto;
}
.gnavi__lists {
 display: flex;
}
.gnavi__list {
 width: 20%;
 height: 60px;
 background-color: #e5f0f8;
 position: relative;
 transition: all 0.3s;
}
.gnavi__list:hover {
 background-color: #0071bb;
}
.gnavi__list:not(:first-child)::before {
 content: "";
 width: 1px;
 height: 100%;
 background-color: #fff;
 position: absolute;
 top: 0;
 left: 0;
 transition: all 0.3s;
}
.gnavi__list:hover::before {
 background-color: #0071bb;
}
.gnavi__list a {
 display: flex;
 justify-content: center;
 align-items: center;
 width: 100%;
 height: 100%;
 text-decoration: none;
 color: #1b4059;
 font-size: 15px;
 letter-spacing: 0.05em;
 font-weight: 600;
 transition: all 0.3s;
}
.gnavi__list:hover a {
 color: #fff;
}

/* ドロップダウンメニュー実装 */
.dropdown__lists {
 display: none; /*デフォルトでは非表示の状態にしておく*/
 width: 100%;
 position: absolute;
 top: 60px;
 left: 0;
}
.gnavi__list:hover .dropdown__lists {
 display: block; /*Gナビメニューにホバーしたら表示*/
}
.dropdown__list {
 background-color: #004d80;
 height: 60px;
 transition: all 0.3s;
 position: relative;
}
.dropdown__list:not(:first-child)::before {
 content: "";
 width: 100%;
 height: 1px;
 background-color: #3492d1;
 position: absolute;
 top: 0;
 left: 0;
}
.dropdown__list:hover {
 background-color: #003558;
}
.dropdown__list a {
 display: flex;
 justify-content: center;
 align-items: center;
 color: #fff;
 text-decoration: none;
 position: relative;
}
.dropdown__list a::before {
 content: "";
 display: block;
 width: 6px;
 height: 6px;
 border-top: 2px solid #fff;
 border-left: 2px solid #fff;
 transform: rotate(135deg);
 position: absolute;
 right: 15px;
 top: calc(50% - 5px);
}