@charset "UTF-8";
html { font-size: 62.5%; }

#contents { width: 100%; margin: 0 auto; }

#fancybox-content { height: auto !important; }

#suguuma { color: #3b302f; font-family: -apple-system, BlinkMacSystemFont, Roboto, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif; overflow: hidden; }

#suguuma div, #suguuma span, #suguuma applet, #suguuma object, #suguuma iframe, #suguuma h1, #suguuma h2, #suguuma h3, #suguuma h4, #suguuma h5, #suguuma h6, #suguuma p, #suguuma blockquote, #suguuma pre, #suguuma a, #suguuma abbr, #suguuma acronym, #suguuma address, #suguuma big, #suguuma cite, #suguuma code, #suguuma del, #suguuma dfn, #suguuma em, #suguuma img, #suguuma ins, #suguuma kbd, #suguuma q, #suguuma s, #suguuma samp, #suguuma small, #suguuma strike, #suguuma strong, #suguuma sub, #suguuma sup, #suguuma tt, #suguuma var, #suguuma b, #suguuma u, #suguuma i, #suguuma center, #suguuma dl, #suguuma dt, #suguuma dd, #suguuma ol, #suguuma ul, #suguuma li, #suguuma fieldset, #suguuma form, #suguuma label, #suguuma legend, #suguuma table, #suguuma caption, #suguuma tbody, #suguuma tfoot, #suguuma thead, #suguuma tr, #suguuma th, #suguuma td, #suguuma article, #suguuma aside, #suguuma canvas, #suguuma details, #suguuma embed, #suguuma figure, #suguuma figcaption, #suguuma footer, #suguuma header, #suguuma hgroup, #suguuma menu, #suguuma nav, #suguuma output, #suguuma ruby, #suguuma section, #suguuma summary, #suguuma time, #suguuma mark, #suguuma audio, #suguuma video { margin: 0; padding: 0; box-sizing: border-box; }

#suguuma main { display: block; }

#suguuma section { position: relative; z-index: 700; }

#suguuma img { vertical-align: bottom; }

#suguuma img[src$=".svg"] { max-width: 100%; }

#suguuma a { color: inherit; text-decoration: none; -webkit-transition: .3s; transition: .3s; }

#suguuma a:hover { opacity: .8; }

#suguuma a:hover img { opacity: 1; }

#suguuma .inner { margin: 0 auto; padding: 0 3.125%; width: 100%; }

#suguuma img { width: 100%; height: auto; }

#suguuma .gothic { font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif; }

#suguuma .mincho { font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; }

#suguuma .pc_hidden { display: block; }

#suguuma .sp_hidden { display: none !important; }

#suguuma #js_mediaFlag { width: 1px; }

#suguuma #kvArea { font-size: 2rem; font-size: 3.125vw; padding: 3.125% 0 32.65625%; background: url(../images/suguuma/kv-bgi.png) center top; background-size: 100% auto; overflow: hidden; }

#suguuma #kvArea .kv_img { font-size: 2rem; font-size: 3.125vw; min-height: 36.5em; -webkit-animation: fadeIn 3s 1s both; animation: fadeIn 3s 1s both; }

@-webkit-keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }

@keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }

#suguuma #kvArea .kv_copy { margin: -9em auto 1em; }

#suguuma .local_nav { z-index: 801; font-size: 2rem; font-size: 3.125vw; }

#suguuma .local_nav .inner { margin-top: -6.5em; padding: 0 6.25%; display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; position: absolute; top: 0; left: 50%; z-index: 700; flex-wrap: wrap; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100%; }

#suguuma .local_nav li { position: relative; width: 28.9285714286%; margin: 0 1.7857142857% 2em; }

#suguuma .local_nav .front { margin-top: -3.125%; z-index: 800; -webkit-box-pack: justify; justify-content: space-between; }

#suguuma .local_nav .front li { margin: 0; }

#suguuma .local_nav .icon_new { margin-bottom: -0.1em; margin-left: -1.25em; position: absolute; bottom: 0; left: 0; width: 45.0617283951%; }

#suguuma .video_area { font-size: 2rem; font-size: 3.125vw; padding: 37.5% 3.125% 12.5%; z-index: 800; background: url(../images/suguuma/movie-bgi.png) center top; background-size: 100% auto; box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.3); }

#suguuma .video_area:after { margin-bottom: 10.15625%; display: block; position: absolute; top: auto; bottom: 0%; left: 50%; z-index: 0; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); width: 100%; height: 100%; content: ""; background: url(../images/suguuma/movie-shadow.png) no-repeat center bottom; background-size: 100% auto; pointer-events: none; }

#suguuma .video_area .vdeo_wrap { margin: 0 auto; border: solid 0.35em #fff; position: relative; z-index: 800; width: 93.3333333333%; -webkit-transition: .3s; transition: .3s; background: url(../images/suguuma/movie-poster.jpg) no-repeat center center; background-size: 100% auto; background-size: cover; }

#suguuma .video_area .vdeo_wrap:before { display: block; position: absolute; top: 0; left: 0; z-index: 800; width: 100%; height: 100%; content: ""; background: url(../images/suguuma/movie-arrow.png) no-repeat center center; background-size: 100% auto; -webkit-transition: .3s; transition: .3s; pointer-events: none; }

#suguuma .video_area .vdeo_wrap:hover { opacity: .8; }

#suguuma .video_area .vdeo_wrap.play:before { opacity: 0; }

#suguuma .video_area video { width: 100%; height: auto; vertical-align: bottom; cursor: pointer; position: relative; z-index: 700; }

#suguuma .bnr-shizimi { margin: 13.3333333333% auto 10%; }

#suguuma .bnr-shizimi a { display: block; position: relative; }

#suguuma .bnr-shizimi a:hover { opacity: .6; }

#suguuma .bnr-shizimi .bnr-shizimi-img { margin-left: -3.3333333333%; width: 106.6666666667%; }

#suguuma .bnr-shizimi .btn-detail { position: absolute; top: 7.3em; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 36%; height: 2em; font-size: 2rem; font-size: 3.125vw; }

#suguuma .cm_box { padding: 2.3333333333%; background: #fff; color: #3b302f; }

#suguuma .cm_box .inner_wrap { padding: 6.1188811189% 2.972027972% 11.013986014%; background: #fdfbf3; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

#suguuma .cm_box .cm_ttl { line-height: 1; text-align: center; }

#suguuma .cm_box .cm_ttl img { width: 23em; height: 2.1em; font-size: 2rem; font-size: 3.125vw; }

#suguuma .cm_box .youtube_list { margin-top: 6.6914498141%; text-align: center; }

#suguuma .cm_box .youtube_list li + li { margin-top: 5.9479553903%; }

#suguuma .cm_box .youtube_list a { display: block; }

#suguuma .cm_box .youtube_list p { margin-top: 2.2304832714%; padding-left: 3.717472119%; display: inline-block; background: url("../images/suguuma/cm-arrow.svg") no-repeat 2% center; background-size: auto 30%; font-size: 2.4rem; font-size: 3.75vw; font-weight: bold; text-align: center; letter-spacing: .075em; }

#suguuma .cm_box .lead { margin: 7.4349442379% auto 0; padding: 3.3457249071% 9.1078066914%; background: url("../images/suguuma/cm-bracket.svg") no-repeat left top, url("../images/suguuma/cm-bracket-r.svg") no-repeat right bottom; line-height: 1.75; font-size: 2rem; font-size: 3.125vw; letter-spacing: .075em; }

#suguuma .cm_box .prof_area { margin: 6.5055762082% auto 0; }

#suguuma .cm_box .headline_obi { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; height: 1.9230769231em; background: #f3f0e3; font-size: 2.6rem; font-size: 4.0625vw; }

#suguuma .cm_box .headline_obi img { width: auto; height: 1em; }

#suguuma .cm_box .prof_list { margin-top: 6.6914498141%; color: #625251; }

#suguuma .cm_box .prof_list dl:nth-child(2) { margin-top: 4.0892193309%; }

#suguuma .cm_box .prof_list dl:nth-child(2) .name { background: url("../images/suguuma/cm-name-bgi-2.png") no-repeat left bottom; background-size: 100% auto; }

#suguuma .cm_box .prof_list .name { padding-left: 32.8996282528%; padding-bottom: 0.7434944238%; background: url("../images/suguuma/cm-name-bgi-1.png") no-repeat left bottom; background-size: 100% auto; font-size: 2.24rem; font-size: 3.5vw; font-weight: bold; }

#suguuma .cm_box .prof_list .name small { margin-left: .5em; letter-spacing: .15em; font-size: 2rem; font-size: 3.125vw; }

#suguuma .cm_box .prof_list dd { margin-top: 1em; display: -webkit-box; display: flex; -webkit-box-align: start; align-items: flex-start; font-size: 2rem; font-size: 3.125vw; line-height: 1.75; }

#suguuma .cm_box .prof_list dd img { width: 28.9962825279%; height: auto; }

#suguuma .cm_box .prof_list dd .prof_txt { margin-top: -0.7434944238%; padding-left: 4.0892193309%; width: 71.0037174721%; }

#suguuma .cm_box + .vdeo_wrap { margin-top: 10%; }

#suguuma .feature { font-size: 2rem; font-size: 3.125vw; padding: 12.5% 0; background: url(../images/suguuma/kv-bgi.png) center top; background-size: 100% auto; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); }

#suguuma .feature #feature_step { padding-bottom: 11.6666666667%; position: relative; background: #fbf8f5; }

#suguuma .feature #feature_step:before { border: solid 0.1em #f2eadb; display: block; position: absolute; top: 50%; left: 50%; z-index: 700; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: calc(100% - 2em); height: calc(100% - 2em); content: ""; }

#suguuma .feature #feature_step .feature-board img { margin-top: -1.9em; position: relative; top: 0; z-index: 800; }

#suguuma .feature #feature_step .step_list { margin-top: .5em; position: relative; overflow: hidden; }

#suguuma .feature #feature_step .step_list:before { display: block; position: absolute; top: 0; right: 0; width: 100%; height: 100%; content: ""; background: #fbf8f5; max-width: 100%; -webkit-transition: 2.5s; transition: 2.5s; }

#suguuma .feature #feature_step .step_list.animation:before { max-width: 0; }

#suguuma .feature .sugu_umai_list { margin-top: 7.5em; }

#suguuma .feature .sugu_umai_list > li { padding: 3.3333333333% 3.3333333333% 5%; position: relative; background: #fff; box-shadow: 0 0 0.5em rgba(234, 230, 222, 0.8); }

#suguuma .feature .sugu_umai_list > li + li { margin-top: 6.5em; }

#suguuma .feature .sugu_umai_list dt { position: absolute; top: -.25em; left: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; }

#suguuma .feature .sugu_umai_list dd { line-height: 1.5; font-size: 2.8rem; font-size: 4.375vw; }

#suguuma .feature .sugu_umai_list dd li { margin-top: 1.25em; padding-right: 1em; display: table; text-align: justify; }

#suguuma .feature .sugu_umai_list dd li:before { display: table-cell; width: 1.25em; text-align: center; content: "・"; }

#suguuma .feature .sugu_umai_list dd li + li { margin-top: .5em; }

#suguuma .feature #sugu { overflow: hidden; }

#suguuma .feature #sugu img { -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transform-origin: center left; transform-origin: center left; }

@-webkit-keyframes slideInSugu { 0% { opacity: 0;
    -webkit-transform: translateX(100%) scale(0);
            transform: translateX(100%) scale(0); }
  80% { opacity: .5;
    -webkit-transform: translateX(-5%) scale(1);
            transform: translateX(-5%) scale(1); }
  100% { opacity: 1;
    -webkit-transform: translateX(0%) scale(1);
            transform: translateX(0%) scale(1); } }

@keyframes slideInSugu { 0% { opacity: 0;
    -webkit-transform: translateX(100%) scale(0);
            transform: translateX(100%) scale(0); }
  80% { opacity: .5;
    -webkit-transform: translateX(-5%) scale(1);
            transform: translateX(-5%) scale(1); }
  100% { opacity: 1;
    -webkit-transform: translateX(0%) scale(1);
            transform: translateX(0%) scale(1); } }

#suguuma .feature #sugu.animation img { -webkit-animation: slideInSugu .5s .2s linear forwards; animation: slideInSugu .5s .2s linear forwards; }

#suguuma .feature #umai { overflow: hidden; }

#suguuma .feature #umai img { -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transform-origin: bottom left; transform-origin: bottom left; }

@-webkit-keyframes slideInUmai { 0% { opacity: 0;
    -webkit-transform: translate(100%, 2%) scale(0);
            transform: translate(100%, 2%) scale(0); }
  50% { opacity: .5;
    -webkit-transform: translate(30%, -10%) scale(0.7);
            transform: translate(30%, -10%) scale(0.7); }
  100% { opacity: 1;
    -webkit-transform: translate(0, 0) scale(1);
            transform: translate(0, 0) scale(1); } }

@keyframes slideInUmai { 0% { opacity: 0;
    -webkit-transform: translate(100%, 2%) scale(0);
            transform: translate(100%, 2%) scale(0); }
  50% { opacity: .5;
    -webkit-transform: translate(30%, -10%) scale(0.7);
            transform: translate(30%, -10%) scale(0.7); }
  100% { opacity: 1;
    -webkit-transform: translate(0, 0) scale(1);
            transform: translate(0, 0) scale(1); } }

#suguuma .feature #umai.animation img { -webkit-animation: slideInUmai .75s .2s linear forwards; animation: slideInUmai .75s .2s linear forwards; }

#suguuma #productWrap { margin-bottom: 14px; padding: 14.0625% 0 15.625%; background: #fbf8f5; font-size: 2rem; font-size: 3.125vw; }

#suguuma #productWrap .product_list li { padding-top: 3em; position: relative; }

#suguuma #productWrap .product_list dt { position: relative; top: 0; left: 0; z-index: 700; width: 100%; }

#suguuma #productWrap .product_list .label_new { margin-top: 3em; position: absolute; top: 0; left: 0; z-index: 801; width: 17.96875%; }

#suguuma #productWrap .product_list .product_img { padding-top: 9em; position: absolute; top: 0; right: 0; z-index: 801; width: 100%; }

#suguuma #productWrap .product_list .icon_new { margin: 0 28.125% 0 57.8125%; position: relative; }

#suguuma #productWrap .product_list .icon_new img { position: absolute; bottom: -1em; }

#suguuma #productWrap .product_list .point { margin-top: 9.5833333333em; margin-left: 2.0833333333em; padding: 0.4166666667em 0 0.625em; display: -webkit-box; display: flex; -webkit-box-align: start; align-items: flex-start; position: absolute; top: 0; left: 0; z-index: 800; width: 50.8333333333%; line-height: 1.3333333333; font-size: 2.4rem; font-size: 3.75vw; color: #6b4f1d; background: url(../images/suguuma/product-border.png) repeat-x center top, url(../images/suguuma/product-border.png) repeat-x center bottom; background-size: auto 2px,auto 2px; font-weight: bold; text-align: justify; letter-spacing: -.05em; }

#suguuma #productWrap .product_list .point img { width: 1.5em; }

#suguuma #productWrap .product_list .point p { padding-left: .5em; width: 11.2083333333em; }

#suguuma #productWrap .product_table { margin-top: 10%; width: 100%; }

#suguuma #productWrap .product_table th, #suguuma #productWrap .product_table td { border: none; padding: .4em 0; line-height: 1.8333333333; font-size: 2.4rem; font-size: 3.75vw; background: url(../images/suguuma/product-border-dotted.png) repeat-x center top #fff; vertical-align: top; text-align: left; }

#suguuma #productWrap .product_table tr:last-child th, #suguuma #productWrap .product_table tr:last-child td { background: url(../images/suguuma/product-border-dotted.png) repeat-x center top, url(../images/suguuma/product-border-dotted.png) repeat-x center bottom #fff; }

#suguuma #productWrap .product_table th { padding-top: .735em; padding-left: 1em; width: 6.6666666667em; line-height: 1.2; font-weight: bold; }

#suguuma #productWrap .product_table th small { padding-top: .25em; padding-right: 1em; display: block; font-size: 2rem; font-size: 3.125vw; -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.9); transform: scale(0.9); }

#suguuma #productWrap .product_table td { padding-right: 1em; width: 18.3333333333em; text-align: justify; letter-spacing: -.015em; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

#suguuma #productWrap .amazonBnr { font-size: 2.4rem; font-size: 3.75vw; margin-top: 10%; padding-left: 2.9166666667em; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; line-height: 5.0416666667em; background: url(../images/suguuma/amazon-bnr-bgi.png) no-repeat; background-size: contain; color: #2c201f; font-weight: bold; letter-spacing: -.05em; }

#suguuma #productWrap .amazonBnr:hover { color: #eb9b00; }

#suguuma #productWrap .amazonBnr + .product_table { margin-top: 6.6666666667%; }

#suguuma #productWrap .karadaBnr { margin-top: 3.6666666667%; display: block; }

/* pc
-------------------------------------------------- */
.spOnly, .br999, .br640 { display: none; }

/* pc-small
-------------------------------------------------- */
@media only screen and (max-width: 999px) { .br999 { display: block; } }

/* tablet
-------------------------------------------------- */
/* sp-side
-------------------------------------------------- */
@media only screen and (max-width: 640px) { html { font-size: 62.5%; } }

/* iPhone5-side
-------------------------------------------------- */
@media only screen and (max-width: 568px) { html { font-size: 55.46875%; } }

/* android-w
-------------------------------------------------- */
@media only screen and (max-width: 540px) { html { font-size: 52.734375%; } }

/* android-m
-------------------------------------------------- */
@media only screen and (max-width: 480px) { html { font-size: 46.875%; } }

/* iphone6plus
-------------------------------------------------- */
@media only screen and (max-width: 414px) { html { font-size: 40.4296875%; } }

/* iphone6
-------------------------------------------------- */
@media only screen and (max-width: 375px) { html { font-size: 36.62109375%; } }

/* android
-------------------------------------------------- */
@media only screen and (max-width: 360px) { html { font-size: 35.15625%; } }

/* iphone5, android-s
-------------------------------------------------- */
@media only screen and (max-width: 320px) { html { font-size: 31.25%; } }