@charset "utf-8";
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
html { font-size: 16px; }
body { line-height: 1; -webkit-text-size-adjust: 100%; font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #281909; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
/*
   contents css
*/
#wrapper { width: 100%; overflow: hidden; }
#wrapper img { width: 100%; height: auto; display: block; }
#wrapper #header { background: #000; overflow: hidden; }
#wrapper h1 { width: 100%; }
#wrapper h1 img { width: 21.875%; max-width: 168px; padding: 1.5% 3%; }
#wrapper .cvArea { position: relative; overflow: hidden; }
#wrapper .base { position: relative; z-index: 2; }
#wrapper .cvBtn01, #wrapper .cvBtn02, #wrapper .cvBtn03 { position: absolute; z-index: 3; }
#wrapper .cvBtn01 { width: 82.5%; top: 65.5%; left: 8.75%; }
#wrapper .cvBtn02 { width: 82.5%; top: 81.5%; right: 8.75%; }
#wrapper .cvBtn03 { width: 54.375%; top: 81.5%; left: 8.75%; }
#wrapper .text01, #wrapper .text01_1 { width: 92%; margin: 1% auto 3%; font-size: 0.625em; line-height: 1.4; }
#wrapper .text02 { width: 90%; margin: 0 auto 3%; color: #cf024f; font-size: 1.0625em; font-weight: bold; line-height: 1; }
#wrapper .text03 { width: 90%; margin: 2% auto 2%; color: #281909; font-size: 0.875em; line-height: 1.6; }
#wrapper .text04 { width: 90%; margin: 2% auto 10%; font-size: 0.625em; line-height: 1.4; /*text-align: right;*/ }
#wrapper .banner02 { width: 92%; margin: 0 auto 10%; }
#wrapper #navi { background: #ea6673; overflow: hidden; }
#wrapper #navi ul { width: 94%; margin: 2% auto; overflow: hidden; }
#wrapper #navi ul li { float: left; width: 23%; margin: 0 1%; }
#wrapper .base { position: relative; }
#wrapper #sliderPro { position: absolute; top: 37%; }
#footer { width: 100%; padding: 6% 0 0; background: #e28f9f; color: #fff; font-size: 0.625em; overflow: hidden; word-wrap: break-word; }
#footer ul { text-align: center; }
#company { float: left; width: 5em; margin: 0 0 5% 20%; text-align: left; }
#privacy { float: right; width: 11em; margin: 0 21% 5% 0; text-align: right; }
#copyright { float: left; width: 80%; margin: 0 10% 6% 10%; line-height: 1.2; }
#footer ul li a { color: #fff; text-decoration: none; }
#following { position: fixed; bottom: -116px; left: 0; width: 100%; z-index: 1000; display: none; font-size: 1em; padding: 1% 0; border-top: 1px solid #efefef; overflow: hidden; background: #fff; background: rgba(255,255,255, 0.8); }
#fBtn { width: 82.5%; margin: 0 auto; }
.fixed { width: 100%; position: fixed; left: 0%; top: 0; z-index: 9999; padding: 0px; background: #ea6673; background: rgba(234, 102, 115, 0.8) !important; }
.fixedFadeIn { -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fixedFadeIn; animation-name: fixedFadeIn; }
.fixedFadeOut { -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fixedFadeOut; animation-name: fixedFadeOut; }
 @keyframes fixedFadeIn {
 from {
bottom:-116px;
}
90% {
bottom:20px
}
 to {
bottom:-1px;
}
}
@-webkit-keyframes fixedFadeIn {
 from {
bottom:-116px;
}
90% {
bottom:20px
}
 to {
bottom:-1px;
}
}
 @keyframes fixedFadeOut {
 from {
bottom:-1px;
}
30% {
bottom:20px
}
 to {
bottom:-116px;
}
}
@-webkit-keyframes fixedFadeOut {
 from {
bottom:-1px;
}
30% {
bottom:20px
}
 to {
bottom:-116px;
}
}
/*============*/
/* スライダー */
/*============*/
#sliderPro { position: absolute; top: 0; left: 6.25%; }
#sliderPro .sp-button { width: 5px; height: 5px; border: none; border-radius: 0; margin: 1% 2%; background: url(../images/sp/btn_slider_off_smt.png) no-repeat; background-size: 100% auto; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -ms-background-size: 100% auto; -o-background-size: 100% auto; }
.sp-selected-button { background: #000; }
#sliderPro .sp-button { border: none; }
#sliderPro .sp-selected-button { width: 5px; height: 5px; background: url(../images/sp/btn_slider_on_smt.png) no-repeat; background-size: 100% auto; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -ms-background-size: 100% auto; -o-background-size: 100% auto; }
#sliderPro.slider-pro .sp-arrow { width: 1.3125em; height: 1.9375em; }
#sliderPro .sp-vertical .sp-arrow { -webkit-transform: none; -ms-transform: none; transform: none; }
#sliderPro.sp-horizontal .sp-previous-arrow { left: -0.625em; width: 1.25em; height: 1.25em; background: url(../images/sp/prev.png) no-repeat; background-size: 100% auto; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -ms-background-size: 100% auto; -o-background-size: 100% auto; }
#sliderPro.sp-horizontal .sp-next-arrow { right: -0.625em; width: 1.25em; height: 1.25em; background: url(../images/sp/next.png) no-repeat; background-size: 100% auto; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -ms-background-size: 100% auto; -o-background-size: 100% auto; }
.slider-pro { position: relative; margin: 0 auto; -moz-box-sizing: content-box; box-sizing: content-box; }
.sp-slides-container { position: relative; }
.sp-mask { position: relative; overflow: hidden; }
.sp-slides { position: relative; -webkit-backface-visibility: hidden; -webkit-perspective: 1000; }
.sp-slide { position: absolute; }
.sp-horizontal .sp-arrows { position: absolute; width: 100%; left: 0%; top: 46%; margin: 0 auto; }
.sp-horizontal .sp-next-arrow { right: 0px; }
.sp-arrow { position: absolute; cursor: pointer; }
.sp-buttons { position: relative; width: 100%; text-align: center; padding: 4% 0 6%; }
.sp-button { width: 0.875em; height: 0.875em; display: inline-block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; cursor: pointer; }
#FootJVScript { display: none; }

/*=============================*/
/* キャンペーンバナー変更_170919 */
/*=============================*/

@media screen and (max-width: 767px){
  .pcContent {display: none !important;}
  .smtContent {max-width: 350px; margin: 10px auto;}
}

/**痩身コンテンツ追加**/
    main .color_bk{
        background-color: #eee9e1
    }
    #wrapper .soushin_content img {
    width: auto;
    max-width: 100%;
}
main{
   overflow: inherit!important;
   background-color: transparent!important;
}
main .soushin_content figure{
   margin: 0;
   padding: 0;
}
main .soushin_content{
   text-align: left;
   margin: 20px auto;
   font-size: 14px;
   line-height: 1.7;

}

/*
 * ==============================================
 * ■画面の横幅が981px以上 (PC)
 * ==============================================
 */
@media screen and (min-width : 981px ){
   .sp,#wrapper .soushin_content img.sp{
      display: none;
   }


main .soushin_content{
    /*background-color: #f0eae2;*/
    /*width: 1200px;
    max-width: 100vw;*/
    /*margin-left: -260px;*/
}
main .soushin_content .textblock{
    max-width: 1008px;
}
main .soushin_content .textblock .grid .midashi .no{
font-size: 56px;
    line-height: 1;
    color: #b8883b;
    padding-right: 15px;
}
main .soushin_content .textblock .grid .midashi{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 6px;
    padding: 5px 8px;
    min-height: 80px;
}
main .soushin_content .textblock .grid .midashi .ttl{
    width: 100%;
}
main .color_bk:before{
        content: "";
    display: block;
    width: 100%;
    height: 30px;
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(238,233,225,1) 100%);
    position: absolute;
    top: -30px;
}
main .color_bk .gridbox .grid .text{
    padding: 0 8px 10px;
}
}
/*
 * ==============================================
 * ■画面の横幅が481pxから980pxまで (Tablet)
 * ==============================================
 */
@media screen and (min-width:481px) and (max-width:980px) {

main .soushin_content .textblock .grid .midashi .no{
    font-size: 4.6rem;
    line-height: 1;
    color: #b8883b;
    padding-right: 15px;
}
main .soushin_content .textblock .grid .midashi{
        display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 6px;
    padding: 5px 8px;
    min-height: 84px;
}
main .soushin_content .textblock .grid .midashi .ttl{
    width: 100%;
}
main .color_bk .gridbox .grid .text{
    padding: 0 8px 10px;
}
.sp,#wrapper .soushin_content img.sp{
      display: none;
   }
}
/*
 * ==============================================
 * ■画面の横幅が480pxまで (SP)
 * ==============================================
 */
@media screen and (max-width:480px){
.pc,.pc.tab,#wrapper .soushin_content img.pc{
      display: none;
   }
main .soushin_content .textblock .grid .midashi .no{
    font-size: 3.4rem;
    line-height: 1.4;
    color: #b8883b;
    padding-right: 10px;
}
main .soushin_content .textblock .grid .midashi{
        display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 6px;
    padding: 5px 8px;
    min-height: 84px;
}
main .soushin_content .textblock .grid .midashi .ttl{
    width: 100%;
}
main .slide_sp .slick-prev, main .slide_sp .slick-next{
    width: 15px;
    height: 15px;
    background-color: rgba(0,0,0,.5);
    padding: 5px;
    top: auto;
    bottom: -20px;
    border-radius: 0;
}
main .slide_sp .slick-prev{
    left: 0;
}
main .slide_sp .slick-next{
    right: 0;
}

main .slide_sp .slick-prev:before{
    width: 10px;
    height: 10px;
    border-color: transparent transparent #fff #fff;
    left: 2px;
    top: 0;
}
main .slide_sp .slick-next:before{
    width: 10px;
    height: 10px;
    border-color: #fff #fff transparent transparent;
    left: -2px;
    top: 0;
}
main .slide_sp .slick-dots li button{
    font-size: 0;
    line-height: 0;
    display: block;
    width: 10px;
    height: 20px;
    padding: 0px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

main .slide_sp .slick-dots li button:before{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0;
    height: 0;
    content: "•";
    text-align: center;
    opacity: 1;
    color: rgb(204, 204, 204);
    -webkit-font-smoothing: antialiased;
    transition: all 0.2s ease 0s;
    border-width: 4px;
    border-style: solid;
    border-color: rgb(204, 204, 204);
    border-image: initial;
    border-radius: 50%;
}
main .slide_sp .slick-dots li.slick-active button:before{
    opacity: 1;
    color: #d4b572;
    /* border-top: 8px solid #d4b572; */
    border: 4px solid #d4b572;
}
main .slide_sp .slick-slide img{
    width: 100vw;
}
main .color_bk{
  position: relative;
}
main .color_bk:before{
    content: "";
    display: block;
    width: 100%;
    height: 50px; 
    background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(238,233,225,1) 100%);
position: absolute;
top: -10px;
left: 0;

}
main .slide_sp .slick-slide img{
  margin: 0!important;
}
}