/* -----------------------------------------------------------------
reset
------------------------------------------------------------------*/

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, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

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

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

input, select {
    vertical-align:middle;
}

li>a{
    display: block;
    width: 100%;
    height: 100%;
    transition: .3s;
}
li>a:hover{
    transition: .3s;
}
/* -----------------------------------------------------------------
text
------------------------------------------------------------------*/
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: normal;
    src: url('../resources/fonts/Work_Sans/WorkSans-Regular.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: 600;
    src: url('../resources/fonts/Work_Sans/WorkSans-SemiBold.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Work Sans';
    font-style: normal;
    font-weight: bold;
    src: url('../resources/fonts/Work_Sans/WorkSans-Bold.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: normal;
    src: url('../resources/fonts/Noto_Sans_JP/NotoSansJP-Regular.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 500;
    src: url('../resources/fonts/Noto_Sans_JP/NotoSansJP-Medium.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: bold;
    src: url('../resources/fonts/Noto_Sans_JP/NotoSansJP-Bold.woff') format('woff');
    font-display: swap;
}

/* font awesome */
@font-face {
    font-family: 'icon';
    src:
      url('../resources/fonts/icon.ttf?jvkdzz') format('truetype'),
      url('../resources/fonts/icon.woff?jvkdzz') format('woff'),
      url('../resources/fonts/icon.svg?jvkdzz#icon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
  }
  
  [class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
  
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  .icon-external-link:before {
    content: "\e900";
  }


body{
    font-family: 'Work Sans' , 'Noto Sans JP', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', sans-serif;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -webkit-appearance: none;
    font-size: 14px;
}

input, textarea, button{
    font-family: 'Work Sans' , 'Noto Sans JP', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', sans-serif;
    font-size: 16px;
  }

h1, h2, h3, h4, h5, h6{
    line-height: 2em;
    font-weight: bold;
    font-family: 'Work Sans' , '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', sans-serif;
}

p, table { line-height:2em;}


/* -----------------------------------------------------------------
common
------------------------------------------------------------------*/
body {
    width: 100%;
    overflow-x: hidden;
    background-repeat: no-repeat;
}

body.gNav-opened{
    overflow-y:hidden;
}

html {
    scroll-behavior: smooth;
}

*, *::before, *:after {
    box-sizing: border-box;
}

img{
    max-width: 100%;
    height: auto;
}
a{
    text-decoration: none;
}
a, button{
    cursor: pointer;
}
button{
    border: none;
}
a.textLink{
    color:#106ECC;
    text-decoration: underline;
  }

a img{ transition:.3s; }
a:hover img{
    opacity: .8;
    transition: .3s;
    transform: scale(1.02);
}

p{ margin: .5em 0 }

.medium{ font-weight: 500; }
.semibold{ font-weight: 600;}
.bold-w{ font-weight: bold; }

br.for-sp{
    display:none;
}

.flex-box{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.lowerLeft{
    border-radius: 0 0 0 130px;
}
.lowerRight{
    border-radius: 0 0 130px 0;
}
.upperRight{
    border-radius: 0 130px 0 0;
}
.upperLeft{
    border-radius: 130px 0 0 0;
}

input[type="text"], input[type="email"], input[type="tel"], textarea {
    border: none;
    background-color: #DEE7E9;
    padding: 0.7em;
    width: 100%;
    border-radius: 0;
}
input:focus, textarea:focus{
    outline:solid 1px #779BA5;/*フォーカス色*/
  }

/* ボタンホバー時のアニメーション：https://coco-factory.jp/ugokuweb/move01/7-1-1/ */
.linkBtn{
    position: relative;
    display: inline-block;
    background-color: #8CC9D9;
    border: 1px solid #fff;
    padding: 1em 3em;
    font-weight: 500;
    font-size: 20px;
    text-align: center;
    overflow: hidden;
    transition: ease .2s;
}
.linkBtn span{
    position: relative;
    z-index: 3;
    color: #fff;
}
.linkBtn:hover span{
    color: #8CC9D9;
}
.linkBtn::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    background-color:#fff;
    width: 100%;
    height: 100%;
    transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    transform: scale(0, 1);
    transform-origin: right top;
}
.linkBtn:hover::before{
    transform-origin:left top;
    transform:scale(1, 1);
    border: 1px solid #8CC9D9;
}

/* ボタン右下アイコン*/

.linkBtn::after{
    content: '';
    position: absolute;
    bottom: 8px;
    right: 8px;
    border-top: 10px solid transparent;
    border-right: 10px solid #fff;
}
.linkBtn:hover::after{
    border-right: 10px solid #8CC9D9;
    z-index:3;
}
/* -----------------------------------------------------------------
スクロール時アニメーション
------------------------------------------------------------------*/

.textAnima span{opacity: 0;}
.textAnima.animated span{ animation:textAnima_on 1s ease-out forwards; }
@keyframes textAnima_on {
  0% {opacity:0;}
  100% {opacity:1;}
}

.fadeInLeft {
    transform: translateX(-20px);
    transition: 1s ease-in-out;
    opacity: 0;
  }
  
.fadeInLeft.animated {
transform: translateX(0);
opacity: 1;
}

.fadeUp{
  transform: translateY(100px);
  opacity: 0;
}

.fadeUp.animated{
    animation: fadeUp .5s forwards;
}

@keyframes fadeUp{
  0%{ opacity: 0; transform: translateY(100px);}
100%{ opacity: 1; transform: translateY(0);}
}

.delay-time02{
    animation-delay: 0.2s!important;
}
    
.delay-time04{
    animation-delay: 0.4s!important;
}

@media screen and (max-width: 599px) {
html {
    overflow-x: hidden;
}
    br.for-sp{
    display:inline-block;
}
}




