@charset "UTF-8";

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 all
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
*{box-sizing: border-box;}
body{font-family: 'Noto Sans JP', sans-serif; font-size: 14px; letter-spacing: 1px; line-height: 2; color: #111;}
main{transition: 0.3s ease-in;}
.inner{max-width: 1200px; width: 100%; margin: 0 auto;}
.inner_1030{max-width: 1030px; width: 100%; margin: 0 auto;}
img{max-width: 100%; width: auto;}
a{color: #27b1b1; text-decoration: none; transition: 0.3s ease-in;}
a:hover{opacity: 0.7;}
.a_clear:after{content: ""; display: block; clear: both;}
ul,li,ol{list-style: none;}
sup{font-size: 50%; vertical-align: top;}

.lookforward[data-animation]{}

.sp_only{display: none;}
.sp_onlyinline{display: none;}
@media screen and (max-width:768px){
    body{font-size: 13px; letter-spacing: 0; line-height: 1.8;}
    .inner{padding: 0 10px;}
    .inner_1030{padding: 0 10px;}
}

@media screen and (max-width:480px){
    body{font-size: 13px; letter-spacing: 0;}
    .pc_only{display: none;}
    .sp_only{display: block;}
    .sp_onlyinline{display: inline;}
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 header
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/* TOPヘッダー */
body#home header,
body header .header_top{position: fixed; width: 100%; z-index: 10; padding: 20px 40px 0;}
body#home header .top_h1,
body header .header_top .top_h1{max-width: 230px; display: inline-block; vertical-align: middle;}
body#home header .top_contact,
body header .header_top .top_contact{display: inline-block; vertical-align: middle; margin-left: 10px;}
body#home header .top_contact a,
body header .header_top .top_contact a{font-family: 'Dosis'; display: block; padding: 5px 10px; color: #fff; font-size: 18px; position: relative;}
body#home header .top_contact a::before,
body header .header_top .top_contact a::before{content: "＋"; color: #2dd9d9; font-weight: bold; margin-right: 5px;}

body#page .top_h1 a,
body#page .top_contact a{pointer-events: none;}

@media screen and (max-width:480px){
    body#home header,
    body header .header_top{padding: 15px 20px 0;}
    body#home header .top_h1,
    body header .header_top .top_h1{max-width: 200px;}
}


/* 下層ヘッダー */
body header .main_header{position: fixed; width: 100%; z-index: 12; padding: 20px 40px 0; background: #fff;
  animation: header-fadeIn 0.5s ease 1.5s forwards; opacity: 0;}
@keyframes header-fadeIn{
  0%{opacity: 0;}
  100%{opacity: 1;}
}
body header .main_header h1{max-width: 230px; float: left;}
body header .main_header .gnav{float: right; margin-top: 6px;}
body header .main_header .gnav .gnav_link{float: left;}
body header .main_header .gnav .gnav_link a{font-family: 'Dosis'; color: #111; font-size: 18px; margin-left: 30px;}


@media screen and (max-width:768px){
  header .navArea{float: none;}

  header .navArea ul.gnav__menu{}
  header .navArea ul.gnav__menu li{margin-left:0; margin-bottom: 30px; text-align: center;}
  body header .main_header .gnav{margin-top: 0;}
  body header .main_header .gnav .gnav_link{float: none;}
  body header .main_header .gnav .gnav_link a{margin-left: 0; font-size: 24px;}

  /*menu*/
  .menu{height: 20px; position: absolute; right: 20px; top: 20px; width: 30px;z-index: 99;}
  .menu__line{background: #333; display: block; height: 2px; position: absolute; transition:transform .3s; width: 100%;}
  .menu__line--center{top: 9px;}
  .menu__line--bottom{bottom: 0;}
  .menu__line--top.active{top: 8px; transform: rotate(45deg);}
  .menu__line--center.active{transform:scaleX(0);}
  .menu__line--bottom.active{bottom: 10px;transform: rotate(135deg);}

  /*gnav*/
  .gnav{background: rgba(255, 255, 255, 0.8); display: none; height: 100%; position: fixed; width: 100%; z-index: 98; top: 0; left: 0; right: 0;}
  .gnav__wrap{align-items:center; display: flex; height: 100%; justify-content: center; position: absolute; width: 100%;}
}

@media screen and (max-width:480px){
  body header .main_header{padding: 15px 20px 0;}
  body header .main_header h1{max-width: 200px;}
}


/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 footer
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
footer{background: #252c2c;}
footer .f_line01{display: flex; justify-content: space-between; padding: 40px 25px 40px;}
footer .f_line01 .f_logo{max-width: 220px;}
footer .f_line01 .f_nav ul li{display: inline-block;}
footer .f_line01 .f_nav ul li a{font-family: 'Dosis'; color: #fff; font-size: 18px; margin-left: 30px;}

footer .f_line02{border-top: 1px solid #4d5a5a; padding: 15px 25px;}
footer .f_line02 .inner{display: flex; justify-content: space-between;}
footer .f_line02 .inner .f_sabNav ul li{display: inline-block; border-left: 1px solid #4d5a5a; line-height: 1;}
footer .f_line02 .inner .f_sabNav ul li:nth-child(1){border-left: none;}
footer .f_line02 .inner .f_sabNav ul li a{font-family: 'Dosis'; font-size: 16px; color: #fff; padding: 0 20px;}
footer .f_line02 .inner .f_sabNav ul li:nth-child(1) a{padding-left: 0;}
footer .f_line02 .inner .f_copy p{font-family: 'Dosis'; font-size: 12px; color: #fff; letter-spacing: 1px;}


@media screen and (max-width:768px){
  footer .f_line01{display: block;}
  footer .f_line01 .f_logo{margin-bottom: 20px;}
  footer .f_line01 .f_nav ul li a{margin-left: 0; margin-right: 30px;}
}
@media screen and (max-width:480px){
  footer .f_line01{padding: 30px 25px 30px; text-align: center;}
  footer .f_line01 .f_logo{margin: 0 auto 20px;}
  footer .f_line01 .f_nav ul li a{margin: 0 5px;}
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
  topArea
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#topArea{height: 100vh; width: 100vw; overflow: hidden;}
.topArea_left{float: left; background: url(../images/top/top_bk_01.jpg) no-repeat center center; background-size: cover;}
.topArea_right{float: right; background: url(../images/top/top_bk_02.jpg) no-repeat center center; background-size: cover;}
.topArea_link{width: 50vw; height: 100%; overflow: hidden; position: relative;}
.topArea_link a{display: block; width: 100%; height: 100%;}
.topArea_link a:hover{opacity: 1;}
.topArea_link a::before{content: ""; display: block; width: 100%; height: 100%; background: rgba(26, 31, 41, 0.4); transition: 0.3s ease-in;}
.topArea_link a:hover::before{background: transparent; opacity: 1;}

/* テキスト */
.top_textArea{position: absolute; bottom: 60px; left: 40px;}
.top_textArea p{color: #fff;}
.top_textArea p.top_textBig{font-family: 'Dosis'; font-size: 70px; font-weight: 200; line-height: 1.3; margin-bottom: 10px;}
.top_textArea p.top_textBig span{font-size: 20px;}
.top_textArea p.top_textSmall{font-size: 18px; line-height: 1.8; visibility: hidden; opacity: 0; transition: all 0.5s linear;}
.topArea_link a:hover .top_textArea p.top_textSmall{visibility: visible; opacity: 1;}
.topArea_left .top_textArea{margin-bottom: 32px;}

@media screen and (max-width:1100px){
  .top_textArea p.top_textBig{font-size: 60px;}
  .top_textArea p.top_textSmall{font-size: 16px;}
}
@media screen and (max-width:768px){
  .topArea_link{width: 100%; height: 50vh;}
  .topArea_left,
  .topArea_right{float: none;}
  .top_textArea{bottom: 30px; left: 40px;}
  .top_textArea p.top_textSmall{animation: toptext-in 0.8s ease 1.5s forwards; visibility: visible;}
  .topArea_left .top_textArea{margin-bottom: 0;}
}
@media screen and (max-width:480px){
  .top_textArea {bottom: 20px; left: 20px;}
  .top_textArea p.top_textBig{font-size: 40px; margin-bottom: 5px;}
  .top_textArea p.top_textSmall{font-size: 13px;}
}


/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 main
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
main{display: block; padding-top: 160px;}
body#home main{padding-top: 0;}

.left_area{float: left; padding: 0 15px; width: 35%;}
.right_area{float: right; padding: 0 15px; width: 65%;}
p.read{font-size: 16px; line-height: 2.3; letter-spacing: 2px;}
.sup{font-size: 10px; vertical-align: top;}
.caption{font-size: 12px;}
.link_box{max-width: 300px; margin: 40px auto;}
.link_box a{display: block; background: #27b1b1; color: #fff; padding: 10px 0; text-align: center;}

.link_arrow a{position: relative;}
.link_arrow a::before{content: ""; width: 20px; height: 1px; display: block; background: #27b1b1; position: absolute; right: -30px; bottom: 5px; transition: 0.3s ease-in;}
.link_arrow a::after{content: ""; width: 8px; height: 1px; display: block; background: #27b1b1; position: absolute; right: -30px; bottom: 9px; transform: rotate(45deg); transition: 0.3s ease-in;}
.link_arrow a:hover::before,
.link_arrow a:hover::after{right: -35px; }


/* タイトル */
.page_title{font-family: 'Dosis'; font-size: 40px; letter-spacing: 4px;}
.t_greenLine{margin-bottom: 50px;}
.t_greenLine span{font-size: 20px; padding-right: 20px; border-bottom: 2px solid #2dd9d9; display: inline-block; line-height: 2; letter-spacing: 2px;}
.t_content{font-family: 'Dosis'; font-size: 25px;}
body.privacy .t_content{margin-bottom: 30px;}
.t_content::after{content: ""; width: 20px; height: 2px; background: #2dd9d9; display: block; margin-top: 25px;}
.t_black_line{font-size: 22px; letter-spacing: 1px; position: relative; margin-bottom: 45px;}
.t_black_line span{background: #e5f5f5; position: relative; z-index: 2; display: inline-block; padding-right: 20px;}
.t_black_line::after{content: ""; width: 100%; height: 2px; background: #111; display: block; position: absolute; top: 50%;}

/*余白*/
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mt70{margin-top: 70px;}

.mb40{margin-bottom: 40px;}
.mb50{margin-bottom: 50px;}
.mb60{margin-bottom: 60px;}
.mb70{margin-bottom: 70px;}

/*左右*/
.column_2{display: flex; justify-content: space-between; flex-wrap: wrap;}
.column_2 .col{width: 48%;}

@media screen and (max-width:480px){
  .column_2 .col{width: 100%;}
}


/*　プライバシーポリシー　*/
body.privacy #privacy_read{padding: 0 0 120px;}


/*　サイトマップ　*/
body.sitemap #sitemap_area{padding: 0 0 120px;}
body.sitemap #sitemap_area .sitemap_list li{margin-bottom: 20px;}
body.sitemap #sitemap_area .sitemap_list li a{font-size: 15px; display: block; background: #e5f5f5; padding: 20px;}
body.sitemap #sitemap_area .sitemap_list li a::before{content: ""; width: 5px; height: 5px; display: inline-block; margin-right:8px; margin-bottom: 3px;
  border-top: 2px solid #27b1b1; border-right: 2px solid #27b1b1; transform: rotate(45deg);}

/*リンク*/
.green_linkBtn{max-width: 300px; margin: 40px auto;}
.green_linkBtn a{display: block; background: #27b1b1; color: #fff; padding: 20px 0; text-align: center;}


@media screen and (max-width:768px){
  main{padding-top: 80px;}
  .left_area,
  .right_area{float: none; width: 100%;}
  p.read{font-size: 14px; line-height: 1.8;}

  /* タイトル */
  .t_content{margin-bottom: 30px;}

  /*余白*/
  .mt40{margin-top: 20px;}
  .mt50{margin-top: 25px;}
  .mt60{margin-top: 30px;}
  .mt70{margin-top: 35px;}

  .mb40{margin-bottom: 20px;}
  .mb50{margin-bottom: 25px;}
  .mb60{margin-bottom: 30px;}
  .mb70{margin-bottom: 35px;}
}

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

    /* タイトル */
    .page_title{font-size: 30px; letter-spacing: 2px;}
    .t_greenLine{margin-bottom: 25px;}
    .t_greenLine span{font-size: 18px; letter-spacing: 0;}
    .t_black_line{font-size: 16px; margin-bottom: 20px; letter-spacing: 0;}
    .t_black_line::after{height: 1px;}
    .t_content{font-size: 20px;}
    .t_content::after{margin-top: 15px;}

    /*　サイトマップ　*/
    body.sitemap #sitemap_area{padding: 0 0 60px;}
    body.sitemap #sitemap_area .sitemap_list li{margin-bottom: 15px;}
    body.sitemap #sitemap_area .sitemap_list li a{padding: 15px;}
}