@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.grecaptcha-badge { visibility: hidden; }
body.page-id-606 .grecaptcha-badge,body.page-id-1464 .grecaptcha-badge { visibility: visible; }
.metaslider .caption {
  font-size: 3.2rem;
  color: #fff;
  background: rgba(0,0,0,0.5);
  padding: 10px;
  border-radius: 5px;
  line-height: 1.4;  
}
/************************************
** menu
************************************/
.widget_nav_menu ul li{position: relative;}
.widget_nav_menu ul li::after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 1px;
  background-color: #ffffff70;
  position: absolute;
  z-index: 2;
  bottom: 2px;
}


.widget_nav_menu ul li a {
  line-height: 1.2;
  background-size: 100%;
  color: #fff;
  font-size: 13px;
  margin-bottom: 10px;
  background-color: #13685a;
  padding-left: 15px;
  padding-right: 10px;
  font-weight: bold;
  padding-top: 7px;
  position: relative;
  transition: color 0.3s ease;
overflow: hidden;z-index: 1;
}
.widget_nav_menu ul li a::after {
  content: "";
  display: inline-block;
  width: 3px;
  height: 30px;
  background-color: #fff;
  position: absolute;
  top: 0;
  transform: translateY(-50%);
  left: 4px;
  z-index: 2;
}

.widget_nav_menu ul li a::before {
  content: "";
  position: absolute;
  left: -100%;
  top: 0;
  width: 100%;
  height: 100%;
  background: #093e35; /* 好きなカラーに変更可能 */
  transition: left 0.3s ease;
  z-index: -1;
}

.widget_nav_menu ul li a:hover::before {
  left: 0;
}

.widget_nav_menu ul li a:hover {
  color: #fff;
}

.navi-company{position:relative}.navi-company .navi-in > ul{padding:0;margin:0;list-style:none;display:flex;flex-wrap:wrap;text-align:center;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}
.navi-company .navi-in a{line-height:1.3;font-weight: bold;padding:5px;background-color:#fff;color:#333;text-decoration:none;display:block;font-size:14px;transition:all 0.3s ease-in-out;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;width:100%;height:100%;
position: relative;
  transition: color 0.3s ease;
overflow: hidden;z-index: 1;
}
.navi-company .navi-in a::before {
  content: "";
  position: absolute;
  left: -100%;
  top: 0;
  width: 100%;
  height: 100%;
  background: #13685a;
  transition: left 0.3s ease;
  z-index: -1;
}
.navi-company .navi-in a:hover::before {
  left: 0;
}

.navi-company .navi-in a:hover {
  color: #fff;
}
.navi-company .navi-in ul li.current_page_item > a{background-color: #3f8479;color: #fff;font-weight: bold;}
@media screen and (max-width: 768px) {
  .navi-company .wrap {
    width: calc(100% - 1em) !important;
  }
    
}
#navi-sub .navi-in a{color:#333;text-decoration:none;display:block;font-size:14px;transition:all 0.3s ease-in-out;border-left:4px solid #6e2030;line-height:1.5;text-align:left;padding:0 0 0 0.5em}ul.sub-menu li:first-child{border-top: 0;}.menu-drawer .sub-menu {padding-left: 0}
#navi-sub .navi-in a:hover{color:#13685a; background: unset}
.header-container-in.hlt-top-menu .logo-header img {
  max-height: 50px;
  height: auto;
  vertical-align: middle;
}
.logo-menu-button img {
  max-height: 50px;
  display: block;
  margin: 0 auto;
}

/************************************
** TOPページスライダー
************************************/

 .front-img-in {max-width:2000px !important;}

.n2-ss-slider .n2-ss-text {
/*font-family: "Zen Old Mincho", serif !important;*/
  font-weight: 900 !important;
  font-style: normal !important;
font-family: 'Times New Roman', Times, serif !important;
}
div#n2-ss-2 .n2-style-7c6db37af68d50ad67b19e087aebbb00-heading{
  font-size: 3em;
  font-weight: bold;
  overflow: hidden; /* clip-path と併用する */
  white-space: nowrap;
  width: 100%; /* 必要に応じて */
  animation: slideIn 2s forwards; 
    animation-delay: 0.6s;
}
div#n2-ss-2 .n2-font-aa002bf7085dbfdad5e79139c31328f3-paragraph{margin-top: 5px !important;
}

@keyframes slideIn {
  0% {
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); /* 初期状態（非表示） */
  }
  100% {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); /* 全体を表示 */
  }
}

div#n2-ss-2 .n2-font-e6fd8f82cdb034bb109dbef14a0b9ecf-hover{
  animation: fadeup 1s cubic-bezier(0.33, 1, 0.68, 1) forwards !important;
}
 
@keyframes fadeup {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}



div#n2-ss-2 .n2-style-bc259f7580131ca8f0467c95032d895e-heading {
  padding: 10px !important;box-shadow: 0px 0px 15px -5px #777777;
}

  div#n2-ss-2 .n-uc-1a3f2fa14ff45 {
    height: 100% !important;
  }
div#n2-ss-2 .n2-style-ab26d61722fdeb2942065e45e4e2d952-heading {
  position: absolute !important;
  bottom: 0 !important;
}
div#n2-ss-2 .n-uc-HmtToxMeZKmn {
  padding: 0 !important;
}   div#n2-ss-2 .n-uc-HphyrqPymrha-inner {
    padding: 0 !important;
  }
div#n2-ss-2 .n2-style-ebffb43388181bbfb1bb85ec5e33754c-heading {
  position: absolute !important;
  bottom: 0 !important;
}div#n2-ss-2 .n-uc-pPxKf13KPG9D {
  padding: 0 !important;
}

div#n2-ss-4 .n2-style-79ebea72ed76f5ef038b7824a2094d86-heading{
 margin-top: 5px !important;   
}
div#n2-ss-2 .n2-style-1865f3b10f4f6fc7f7dceaf912bccd34-heading{font-family:"Noto Sans JP","Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "メイリオ", sans-serif !important;font-weight:500 !important;}

/************************************
** カルーセル
************************************/
.carousel-entry-card {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); height: 270px; 
  overflow: hidden;
}
#carousel .carousel-entry-card-title {font-size: 14px;
  text-align: justify;
  word-break: break-all;
  text-justify: inter-ideograph;
  text-justify: inter-character;
  word-wrap: break-word;
  overflow-wrap: break-word;
  padding: 10px;
  line-height: 1.3;
  letter-spacing: -1px;

}.carousel-content .a-wrap {
  margin: 0 auto;
  text-align: center;
}

.gyoumu_subbox p{text-align:justify;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word; letter-spacing: -1px;padding:0 2.5em 1em 0;margin:0;
}
.gyoumu_subbox a:hover{box-shadow: 0px 8px 10px -3px #d4d4d4}

@media screen and (min-width: 1023px){.mt2{margin-top: 1em}
}
@media screen and (max-width: 1023px){
.mt2{margin-top: 2em}
}



/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
body.page-template-page-front .front-img-in figure {padding: 0;}
 .logo-menu-button img {max-height:30px !important;}
.content:not(:lang(ja)) {margin-top: 20px !important;}
}

/*834px以下*/
@media screen and (max-width: 834px){
div#n2-ss-2 .n2-style-bc259f7580131ca8f0467c95032d895e-heading {
  padding:0 0 3px 0 !important;
}  .content:not(:lang(ja)) {
    margin-top:20px !important;
  }
	.gyoumu_subbox_in{background-image: unset !important;}
}

/*480px以下*/
@media screen and (max-width: 480px){

 div#n2-ss-2 .n-uc-JnXvkgd31XBv-inner,div#n2-ss-2 .n-uc-kQOjyzig0XR9-inner{padding: 0 !important;}
div#n2-ss-2 .n-uc-IAwAss6vmMSc {margin-bottom: 5px !important;}
div#n2-ss-2 .n2-style-c9c30b5f71c49b70706b6a6c4aede6a9-heading {padding: 10px 20px 20px 20px !important;}
.gyoumu_subbox p {padding: 0 0 1em 0 !important;}
}