/* ---------- color ------------ */
.txt_color_nomal{color: #886e69;}
h2,h3,h4,p,div{color: #886e69;}
.txt_color_nomal{color: #66514d;}
h2,h3,h4,p,div{color:#66514d;}

h2,h3{font-family: 'RocknRoll One', sans-serif;}
.cate_title{font-family: 'RocknRoll One', sans-serif;}

/* text color */
.txt_color1{color: #fa8989} /* メインカラー */

/* background color */
.bg_color1{background-color: #9c6f65} /* メインカラー */
.bg_color2{background-color: #ffffd1;} /* サブカラー */
.bg_color3{background-color: #ffe8d1;} /* アクセントカラー1 */
.bg_color4{background-color: #fa8989} /* アクセントカラー2 */

/* ---------- common ------------ */
a{
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
#body{background: #fffff1;}

img {
    border-radius: 10px;
}

figure{border-radius: 30px;}


.cate_list li a{
    border: 2px dashed #97d297;
    border-radius: 30px;
    padding: 5px 15px;
    background: rgba(255,255,255,0.5);
}
.linkStyle{
    color: #afd1ff;    
}

.linkStyle:hover{color: #8cb1e4;}

#header{
    padding: 20px 30px;
}

#main_nav ul{padding-top: 40px;}

#main_nav ul li{
    width: 20%;
    text-align: center;
}

#main_nav ul li a{
    position: relative;
    font-family: 'RocknRoll One', sans-serif;
}

#main_nav ul li{position: relative;}

#main_nav ul li::before{
    content:'';
    position: absolute;
    top: -18px;
    left: 0px;
    left: 0px;
    height: 85px;
    width: 7px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

#main_nav ul li:nth-child(1)::before{
    background-image: url(./Dup/img/dot_pink.png);
}

#main_nav ul li:nth-child(2)::before{
    background-image: url(./Dup/img/dot_orange.png);
}
#main_nav ul li:nth-child(3)::before{
    background-image: url(./Dup/img/dot_yellow.png);
}
#main_nav ul li:nth-child(4)::before{
    background-image: url(./Dup/img/dot_green.png);
}
#main_nav ul li:nth-child(5)::before{
    background-image: url(./Dup/img/dot_blue.png);
}
#main_nav ul li:nth-child(5)::after{
    content:'';
    position: absolute;
    top: -18px;
    right: 0px;
    background-image: url(./Dup/img/dot_purple.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    height: 85px;
    width: 7px;
}

#main_nav li a:hover, 
.sc_nav li a:hover {
    text-shadow: 0 3px 5px rgba(250,137,137,0.3);
    color: #fa8989;
    letter-spacing: 2.1px;
}


/* main_nav icons -------------------------- */
#main_nav ul li a{
    position: relative;
    width: 100%;
    top: 35px;
    left: 4px;
}
#main_nav ul li a::before{
    content:'';
    position: absolute;
    top: -56px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    height: 60px;
    width: 60px;
    left: 38%;
}

#main_nav ul li:nth-child(1) a::before{
    background-image: url(./Dup/img/icon-news.png);
}

#main_nav ul li:nth-child(2) a::before{
    background-image: url(./Dup/img/icon-about.png);
}
#main_nav ul li:nth-child(3) a::before{
    background-image: url(./Dup/img/icon-service.png);
}
#main_nav ul li:nth-child(4) a::before{
    background-image: url(./Dup/img/icon-recruit.png);
}
#main_nav ul li:nth-child(5) a::before{
    background-image: url(./Dup/img/icon-interview.png);
}


/* --- sp nav --- */
#menu_wrap ul li a{
    font-size: 16px;
    font-family: 'RocknRoll One',sans-serif;
}

/*shop link*/
#header .shop_link a{
    color: #97d297;
    border-radius: 30px;
    background: #e7fbe7;
    padding: 5px 13px;
    border: 2px dashed;
}

.sc_nav{
    background-color: rgb(255, 255, 255);
    z-index: 8;
    padding: 20px 20px 5px;
}

.sc_nav ul li a{
    color: #fa8989;
    transition: 0.3;
}
.sc_nav ul li a:hover{
    border-bottom: 2px dotted #ffd1d1;
}
.sc_nav li a:hover {
    text-shadow: 0 3px 5px rgba(250,137,137,0.5);
}

.sc_nav.active::after{
    content:'';
    position: absolute;
    bottom: -75px;
    left: 0;
    right: 0;
    background-image: url(./Dup/img/nami_white.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: 100px;
    width: 100%;
    opacity: 1;
    z-index: -1;
}


.sc_nav .shop_link a {
    color: #97d297;
    border-radius: 30px;
    background: #e7fbe7;
    padding: 7px 9px;
    border: 2px dashed;
    opacity: 1.0;
    }

.sc_nav .logo img {
    /*max-width: 140px;*/
    z-index: 10;
    max-width: 100px;
}

/* --- footer ------------------------------------ */
footer{
    position: relative;
    margin-top: 100px;
}
footer::before{
    content: '';
    position: absolute;
    top: -30px;
    background-image: url(./Dup/img/nami_yellow02.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top;
    height: 100px;
    width: 100%;
}

#footer{padding-top: 30px;}

#footer_txt p,
#footer_links a{
    color: #fa8989;
}
#footer_txt p{
    line-height: 1.7;
}

#footer_links li::after {
    color: #97d297;
}

#copyright{
    text-align: center;
}

/* ---------- top ------------ */

h1 img {
    width: 140px;
}


#top_contents1-2 {
  margin-top: 200px;
}

#main_img img, 
#intro img, 
#top_contents1 img, 
#top_contents1-2 img,
#top_contents2 img{
    transition: ease 0.3s;
    cursor: pointer;
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
}

#main_img figure{border-radius: 0px 0px 50px 50px;}

#intro .intro_img {
    margin-bottom: 110px;
}

#intro .slick-dots li {
    height: 16px;
    width: 16px;
    /*box-sizing: border-box;*/
    /*border-style: solid;*/
    background-color: #d1ffe8;
    border-radius: 30px;
    opacity: 1.0;
    margin: 0 10px;
    cursor: pointer;
    border:none;
}
#intro .slick-dots li.slick-active {
    background-color: #ffd1ff;
}


.intro_txt{
  background-image: url("./Dup/img/moyomoyo-orange.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding-top: 50px;
  padding-bottom: 100px;
  z-index: -3;
}

.intro_txt h2 {
    background: #ffffff;
    border-radius: 15px;
    border: 2px dashed #9c6f65;
}

#intro .intro_txt,
#intro .intro_txt h2{
    position: relative;
}

#intro .intro_txt h2::before{
    content:'';
    position: absolute;
    top: -56px;
    left: -98px;
    background: url(./Dup/img/rainbow01.png);
    height: 201px;
    width: 235px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
     z-index: -2;
}
#intro .intro_txt::after{
    content:'';
    position: absolute;
    bottom: -30px;
    right: -64px;
    background: url(./Dup/img/clouds_line.png);
    height: 201px;
    width: 235px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -2;
}

#intro .intro_txt span{
    z-index: 0;
}

/*-- after --*/

#top_contents1-2 figure {
    position: absolute;
    bottom: 20px;
    right: 0;
    z-index: 1;
}

#top_contents1-2 .contents1-2_txt h3 {
    position: relative;
    z-index: 2;
    transform: translateX(80px);
    text-shadow: 0 0 5px rgba(0, 0, 0,0.2);
}

#top_contents1-2 .contents1-2_txt {
    margin-right: 60%;
    box-sizing: border-box;
}

#top_contents1-2 .contents1-2_txt h3 {
    position: relative;
    z-index: 2;
    transform: translateX(80px);
    text-shadow: 0 0 5px rgba(0, 0, 0,0.2);
}

#top_contents1-2 .contents1-2_txt {
    margin-right: 60%;
    box-sizing: border-box;
}

#top_contents1
{
  background-image: url("./Dup/img/yellow-bg07.png");
  background-repeat: no-repeat;
  background-size: cover;
}

#top_contents1-2
{
  background-image: url("./Dup/img/lime-bg01.png");
  background-repeat: no-repeat;
  background-size: cover;
}

#top_contents2 d-flex{
/*    background: rgba(255,255,255,.5);*/
}

#top_contents2 h3 {
    padding-right: 50px;
    padding-left: 50px;
}
.contents2_txt{
    position: relative;
}

.contents2_txt::before{
    content:'';
    position: absolute;
    top:0;
    background: url(./Dup/img/wakka01.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    height: 100%;
    width: 100%;
    z-index: -1;
}

#top_contents2 h3::after{
    border:none;
}

#top_contents2 h3 span{
    background:none;
}

/*
.top_cms_title {
    background-image: url(./Dup/img/rainbow_maru.png);
    background-repeat: no-repeat;
    background-size: contain;
}*/

.top_cms_title h4{
    font-family: 'RocknRoll One', sans-serif;
    position: relative;
}

.top_cms_title p{
    position: relative;
    border:none;
}

.top_cms_title h4::before{
    content:'';
    position: absolute;
    left: -24px;
    top: -21px;
    background-image: url(./Dup/img/funya_blue.png);
    height: 70px;
    width: 70px;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -2;
    opacity: 0.7;
}


.top_cms_title{
    justify-content: center;
    padding-top: 100px;
}


/* interview */
#top_cms .cms_6-c .cate_box{
    border-radius: 30px;
}

#top_cms .cms_6-c .box_txt1{
    position: relative;
    max-height: calc(16 * 2.0 * 6 * 1px);
    line-height: 2.0;
    word-break: break-all;
    overflow: hidden;
}

#top_cms .cms_6-c .box_txt1::before,
#top_cms .cms_6-c .box_txt1::after {
  position: absolute;
  background: #fff;
}
#top_cms .cms_6-c .box_txt1::before {
 content: '...';
  top: calc(16 * 2.0 * (6 - 1) * 1px);
  right: 0;
  width: 1.5em;
}
#top_cms .cms_6-c .box_txt1::after {
  content: '';
  width: 100%;
  height: 100%;
}

.cms_6-c .box_title{
    background-color: #e8ffd1;
    padding: 10px 20px;
    border-radius: 30px 30px 0 0;
}

#top_cms .cms_6-c .box_txt1{
    margin: 20px;
}

/* more btn */
#top_cms .top_cms_box .more a {
    border-radius: 30px;
    transition: 0.3s;
}

#top_cms .top_cms_box .more a:hover{
    transform: translateY(2px);
    background-color: #fa8989;
    color:#fffff1;
    
}

#top_cms .top_cms_box .more a:active {
    border-radius: 30px;
}

.more{
    text-align: center;
    padding-right: 0;
}

#top_cms .top_cms_box .more a:hover span.on {
    border-radius: 30px;
}

.top_cms_box .more .on {
    display: none;
}

/* ------------------ sub -----    ----------- */

#page_title {
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
    border-radius: 30px;
}

#page_title h2{font-size:30px;}
#page_title p{font-size:20px;}

#page_title h2,
#page_title p {
    text-shadow: 0 0 4px rgb(255 255 255 / 90%);
    line-height: 1.3;
}

/* --- about --- */
#cms_2-c .box_wrap .box_item .box_txt1 {
    position:relative;
    color: #9797d2;
}
#cms_2-c .box_wrap .box_item .box_txt1::before{
    content:'';
    position:absolute;
    left: -53px;
    top: -12px;
    background:url("./Dup/img/piko02.png");
    background-position: right;
    background-repeat: no-repeat;
    background-size: contain;
    height:50px;
    width:50px;
}

/*--- contact ---*/
#page08 .tel_contact{
    width: 80%;
    margin: auto;
}

#contact_tel{
    white-space: nowrap;
    border-radius: 50px;
    background: #97d297;
    color: #fff;
    padding: 5px;
    font-size: 20px;
    width: 50%;
    margin: 20px auto 40px;
}

#contact_tel a{
    font-size: 20px;
    color: #fff;
}

/* --- recruit --- */

#cms_6-a .box_wrap{
    background: #fff;
    border-radius: 50px;
    width: 66%;
    margin: auto;
    padding: 20px 30px;
}

#cms_6-a .box_wrap .cate_box {
    border-color:#a6e2c4;
}

#cms_6-a .cate h3 {
    background: none;
    color: #886e69;
    text-align: center;
}

/* --- interview --- */

#cms_6-c .box_wrap .cate_box{
    border-radius: 50px;
}

#cms_6-c .box_wrap .cate_box .box_title{
    background-color: #d1e8ff;
    padding: 10px 20px;
    border-radius: 50px 50px 0 0;
}

#cms_6-c .box_wrap .cate_box .box_txt1{
    margin: 0px 30px;
    padding: 30px 10px;
}

#page07 .box_wrap .box:hover{
    background-color: #ffffd1;
}

#page07 .box_wrap .box h3,
#page07 .box_wrap .box p
{
    border-bottom: 1px dashed #d1d1ff;
}

/* page09 */
#page09 .top_txt{
    border-radius: 50px;
}


/* --- page10 --- */
#page10 ul li a{
    border:none;
    border-radius: 50px;
    background: #ffffd1;
    width: 65%;
    margin: 10px auto;
    padding: 12px 12px;
}

#page10 ul li a span.on{
    background-color: #fda3a3 !important;
}

#page08 .tel_txt {
    border-radius: 50px;
    background: #fff;
    border: 2px dashed #fa8989;
        padding: 16px 24px;
}


/* ----------------------------------------------
IE 
----------------------------------------------*/
@media all and (-ms-high-contrast: none){

}

/* ------------------ PC under 1367px ------------------- */
@media screen and (max-width: 1367px){
    header #header {
        padding: 20px 30px;
    }
}

/* ------------------ PC under 1281px ------------------- */
@media screen and (max-width: 1281px){
    #wrap{overflow: hidden;}
    
 #top_contents1-2 figure {
    position: relative;
    bottom: 40px;
    z-index: 1; 
  }
  
  #top_contents1-2 .contents1-2_txt h3 {
    margin-bottom: 20px;
  }
  
  #top_contents1-2 .contents1-2_txt {
    width: 60%!important;
    margin-left: 40%;
    padding-top: 30px;
    padding-right: 20px;
  }
  
  #page10 ul li a {;
    width: 80%;
}

#page10 ul li a span {
    font-size: 16px;
}

}

@media screen and (max-width:987px){
    #main_nav ul li a{
        font-size:14px;
    }
}

/* ------------------ TB ------------------- */
@media screen and (max-width: 768px){

  #top_contents1 .contents1_txt {
    width: 80%!important;
    margin: auto!important;
}
  
  #top_contents1-2 .contents1-2_txt {
    /*width: 70%;
    margin-left: 30%;*/
    width: 80% !important;
    margin: auto;
  }
  
    
  .contents1_txt,
  .contents1-2_txt {
    width: 80%;
    margin: auto;
  }
  
  #top_contents1 .contents1_txt h3,
  #top_contents1-2 .contents1-2_txt h3 {
    transform: translateX(0px);
}
  
  footer::before{ top: -25px;}
  #menu_wrap ul li {margin-bottom: 22px;}


#menu_bt > div span {
    background-color: #886e69;
}

.shop_link a{
    border-radius: 50px;
    color: #97d297;
    border: 2px dashed;
    background: #e7fbe7;
    font-size: large;
}
#page10 ul li {
    padding: 0;
}
#page10 ul li a {
    width: 95%;
    padding: 12px 3px;
}
#page10 ul li a span {
    font-size: 14px;
}

.linkStyle{
    text-decoration: underline;   
}

#wrap{overflow: hidden;}

}
/* ------------------ SP ------------------- */
@media screen and (max-width: 667px){
  
  #top_contents1-2 {
    margin-top: 0px;
  }
  
  #top_contents1-2 figure {
      bottom: 0;
  }
  
#top_contents1 .contents1_txt,
#top_contents1-2 .contents1-2_txt{
    width: 100%!important;
    margin: auto!important;
}

  
  #top_contents1-2 .contents1-2_txt h3 {
    transform: translateX(0px);
  }

/* top interview */

#top_cms .cms_6-c .box_txt1{
      position: relative;
      max-height: calc(14 * 2.0 * 5 * 1px);
      line-height: 2.0;
      word-break: break-all;
      overflow: hidden;
  }
  
  #top_cms .cms_6-c .box_txt1::before {
    content: '...';
    top: calc(14 * 2.0 * (5 - 1) * 1px);
    right: 0;
    width: 1.5em;
  }
  
  #cms_2-c .box_wrap .box_item .box_txt1::before {
    height: 42px;
}

  footer::before{top: -6px;}
  #menu_wrap ul li {
    margin-bottom: 10px;
 }
 
 h1 img {
    width: 60px !important;
}
header #header {
    padding: 13px;
}
#intro .intro_txt h2::before {
    top: -76px;
    left: -61px;
    width: 180px;
}
  #intro .intro_txt::after {
    right: -9px;
    width: 180px;
      
  }
  .contents2_txt {
    padding: 60px 0px;
    margin: 20px;
  }
  footer {
    margin-top: 30px;
}
#contact_tel a{
    font-size: 16px;
}

#contact_tel{
    width: 80%;
    margin: 10px auto 20px;
}

#cms_6-a .box_wrap {width: 80%;}

#loader .logo {
    max-width: 300px;
    width: 70%;
    text-align: center;
}

#loader .logo img{
    width:180px;
    margin: auto;
}
  
}

/* ------------------ SP small ------------------- */
@media screen and (max-width: 380px){
    #page_title h2{
        font-size:22px;
    }
    #page_title p{
        font-size:16px;
    }
    
    #page10 ul li a{
        width:80%;
    }
}