@charset "utf-8";

/*====================↓スライドアニメ====================*/


/*-------------------
  スライドアニメーション
  -------------------*/

.slide_element_frame {
 padding:0px 0px 0px 0px;
/*
 padding:0px 0px 50px 0px;
*/
}
/*指定：600px～ */
@media print, screen and (min-width: 600px) {
.slide_element_frame {
 padding:0px 0px 0px 0px;
/*
 padding:0px 0px 100px 0px;
*/
}
}


/*スライドアニメーション枠*/
.slide_element {
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  min-width:100vw;
  overflow: hidden;
  object-fit: cover; /*比率を維持し、はみ出した箇所は切り取り*/
}

/*スライド要素*/
.slide_element ul {
  padding: 0;
  margin: 0;
  width: 100%;
  display: flex;
  flex-shrink: 0;
}

/*-----*/
/*1行目*/
/*-----*/

/*アニメーションの設定（先頭のul要素）*/
.slide_element ul.line_1:first-child {
  animation: slide_first /*アニメーションの設定名*/
             80s         /*アニメーションスピード*/
             -40s        /*アニメーション開始時の時間を指定*/
             linear      /*オプション：等速アニメーション*/
             infinite;   /*オプション：無限ループ*/
}
/*アニメーションの設定（末尾のul要素）*/
.slide_element ul.line_1:last-child {
  animation: slide_last /*アニメーションの設定名*/
             80s        /*アニメーションスピード*/
             0s         /*アニメーション開始時の時間を指定*/
             linear     /*オプション：等速アニメーション*/
             infinite;  /*オプション：無限ループ*/
}

/*-----*/
/*2行目*/
/*-----*/

/*アニメーションの設定（先頭のul要素）*/
.slide_element ul.line_2:first-child {
  animation: reverse_slide_first /*アニメーションの設定名*/
             80s         /*アニメーションスピード*/
             -40s        /*アニメーション開始時の時間を指定*/
             linear      /*オプション：等速アニメーション*/
             infinite;   /*オプション：無限ループ*/
}
/*アニメーションの設定（末尾のul要素）*/
.slide_element ul.line_2:last-child {
  animation: reverse_slide_last /*アニメーションの設定名*/
             80s        /*アニメーションスピード*/
             0s         /*アニメーション開始時の時間を指定*/
             linear     /*オプション：等速アニメーション*/
             infinite;  /*オプション：無限ループ*/
}





.slide_element ul li {
  display: inline-block;
  width: 100%;
  margin-right: 5px; /*画像と画像の間隔*/
  margin-bottom: 5px;
  list-style: none;
  text-align: center;
}
.slide_element ul li img {
  display: block;
  width: 100%;
  height: auto;
}


/*ウィンドウ幅を小さくしても画像がこれ以上縮小しない値を設定（以下の例ではウィンドウサイズが『835px』以下になると画像が小さくならなくなる）*/
@media screen and (max-width: 835px) {


  /*枠要素の中でスライドするul要素*/
  .slide_element ul {
    width: 835px;
  }


}

/*--------------------------------*/
/*キーフレーム（スライドアニメーション）*/
/*--------------------------------*/

/*先頭のul要素*/
@keyframes slide_first {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
/*末尾のul要素*/
@keyframes slide_last {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-200%);
  }
}
/*逆方向へ移動の先頭のul要素*/
@keyframes reverse_slide_first {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(100%);
  }
}
/*逆方向へ移動の末尾のul要素*/
@keyframes reverse_slide_last {
  0% {
    transform: translateX(-200%);
  }
  100% {
    transform: translateX(0);
  }
}


/*====================↑スライドアニメ====================*/





.special_yorisoi_text {
    width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    font-size: 0.9em;
    line-height: 1.6em;
    padding: 10px 0px 40px 0px;
}
.special_moyoi_text {
     width: 90%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    font-size: 0.9em;
    line-height: 1.6em;
    margin-top: 20px;
    margin-bottom: 80px;
}


/*special↓*/
.special_box_line {
  width: 85%;
  max-width: 1100px;
  margin: 0px auto 50px auto;
  padding:50px 0px 0px 0px;
  border-bottom: 4px dotted #C2C2C2;
}
.special_box {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    display: flex;
    flex-direction: column-reverse;
/*★★padding-bottom:50px;*/


/*★*/
/*
    margin-top: 50px;
*/

}
.special_box:last-child {
    padding-bottom: 0px;
}


.special_box_2 {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;

/*★padding-bottom:50px;★*/

/*★

    margin-top: 50px;
    border-bottom: 4px dotted #C2C2C2;
    border-top: 4px dotted #C2C2C2;
    padding-bottom: 80px;
    padding-top: 80px;
*/
}

.special_img img {
    width: 100%;
    height: auto;
    max-width: 565px;
}

.special_title_box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;

}
.special_title {
    width: 70%;
    border-left: 4px solid #00BBA8;
    color: #5A4A37;
    font-weight: bold;
    font-size: 1.2em;
    line-height: 1.4em;
    padding-left: 10px;
}
.special_n1 {
    width: 20%;
    padding-left: 2%;
    color: #DFEFEC;
    font-weight: bold;
    font-size: 2.8em;
    text-align: right;
    padding-top: 10px;
}

.special_n2 {
    width: 20%;
    padding-left: 2%;
    color: #FAEACE;
    font-weight: bold;
    font-size: 2.8em;
    text-align: right;
    padding-top: 10px;
}

.special_n3 {
    width: 20%;
    padding-left: 2%;
    color: #FADDDF;
    font-weight: bold;
    font-size: 2.8em;
    text-align: right;
    padding-top: 10px;
}

.special_text {
    margin-top: 20px;
    font-size: 0.9em;
    line-height: 1.6em;
padding-bottom:20px;
}

.special_img{
    width: 90%;
    margin-left: auto;
    margin-right: auto;
/*
    margin-top: 30px;
*/
}



/*kodawari */

.special_kodawari_box {
    background-color: #FFFFFF;
    width: 86%;
    max-width: 1050px;

    margin:25px auto 0px auto;
    padding: 40px 10px;

/*★*/
/*
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 80px;
*/
}
.kodawari_title {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    color: #5A4A37;
    font-size: 1.2em;
    line-height: 1.4em;
    border-bottom: 3px dashed #FFBE36;
    text-align: center;
    font-weight: bold;
    padding-bottom: 8px;
    margin-bottom: 30px;

}

.kodawari_text {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    font-size: 1em;
    line-height: 1.6em;
}
.kodawari_img li img {
    width: 100%;
    height: auto;
    max-width: 482px;
}
.kodawari_img li {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    margin-bottom: 30px;
}


/*3kyouyu */
/*★
.special_3kyouyu_box {
    background-color: #FCF8CC;
    padding: 50px 0px 50px 0px;
}
*/
.special_3kyouyu_text {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    font-size: 0.9em;
    line-height: 1.6em;
}
.special_3kyouyu_box ul li {
    background-color: #FFFFFF;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    margin-bottom: 30px;
    padding-bottom: 40px;
    border-radius: 10px;
}
li .special_kyouyu_title_img img {
    width: 100%;
    height: auto;
    max-width: 65px;
}

li .special_kyouyu_title {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 20px;
    padding-bottom: 20px;
    display: flex;
    align-items: center;
}
.special_kyouyu_title_img {
    width: 15%;
    margin-left: 3%;
    margin-right: 5%;
}
.special_kyouyu_title_text {
    color: #5A4A37;
    font-weight: bold;
    font-size: 1.2em;
    width: 70%;
}
li .special_kyouyu_img img {
    width: 100%;
    height: auto;
    max-width: 370px;
}
li .special_kyouyu_img {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}
ul li .special_kyouyu_text {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    font-size: 0.9em;
    line-height: 1.6em;
    padding-top: 10px;
}
.special_advice_link a img {
    width: 100%;
    height: auto;
    max-width: 320px;
    max-height: 54px;
}
ul li .special_advice_link {
    text-align: center;
    margin-top: 20px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}



.special_kyouyu_undertext {
    width: 90%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    font-weight: bold;
    font-size: 0.9em;
    line-height: 1.6em;
}


/*指定：600px～ */
@media print, screen and (min-width: 600px) {
.special_moyoi_text {
    text-align: center;
}


/*special↓*/
.special_box_line {
  padding-bottom:50px;
  border-bottom: none;
}
.special_box {
    display: flex;
    flex-direction: row;
    align-items: center;

/*★★padding-bottom:100px;*/

/*★
    padding-bottom: 50px;
*/
}
.special_kodawari_box{
/*★★padding-bottom:100px;*/

    margin:50px auto 0px auto;

}
.special_box_2 {

    display: flex;
    align-items: center;

/*★★padding-bottom:100px;*/

/*★
    border-bottom: 4px none #C2C2C2;
    border-top: 4px none #C2C2C2;

    padding-bottom: 80px;
    margin-top: 50px;
*/
}


.special_text_box {
    background-color: #FFFFFF;
    width: 55%;
    margin-left: 2.5%;
    margin-right: 2.5%;
    padding-top: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
}

.special_img{
    width: 37%;
}

.special_title {
    width: 70%;
    color: #5A4A37;
    font-weight: bold;
    font-size: 1.3em;
    line-height: 1.4em;
    border-left-width: 6px;
}

/*kodawari */

.kodawari_title {
    font-size: 1.4em;
    border-bottom: 3px dashed #FFBE36;

}

.kodawari_img {
     display: flex;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

.kodawari_img li {
    width: 45%;
}



/*3kyouyu */
.special_3kyouyu_box {
/*
  padding: 100px 0px 100px 0px;
*/
}
.special_3kyouyu_text {
    text-align: center;
}

.special_3kyouyu_box ul {
    display: flex;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    max-width: 1100px;
}


.special_3kyouyu_box ul li {
    width: 32%;

}


.special_kyouyu_title_img {
    width: 15%;
}
.special_kyouyu_title_text {
     width: 80%;
}






}

 /*指定：835px～ */
@media print, screen and (min-width: 835px) {
.special_yorisoi_text {
    text-align: center;
    padding: 20px 0px 80px 0px;
}
.special_text_box {
    width: 40%;
    padding-top: 40px;
    padding-right: 20px;
    padding-bottom: 40px;
    padding-left: 20px;
}
.special_img {
    width: 45%;
}
.special_title   {
    font-size: 1.6em;
}
.special_kodawari_box {
/*★
    margin-top: 70px;
    margin-bottom: 150px;
*/
}


.kodawari_title {
    font-size: 1.7em;
    width: 40%;
    max-width: 400px;
}
.special_kodawari_box {
/*★
    padding-top: 50px;
    padding-bottom: 50px;
*/
}
.kodawari_text {
    text-align: center;
}
.special_3kyouyu_box ul {
/*
    margin-top: 40px;
    margin-bottom: 40px;
*/
}
.special_kyouyu_title_text {
    font-size: 1.65em;
    width: 73%;
}
.special_kyouyu_title_img {
    width: 18%;
}
li .special_kyouyu_title {
    padding-top: 30px;
}

.special_kyouyu_undertext {
    font-size: 1.1em;
    text-align: left;
}

}