/*layout css for French ver.*/
body { margin: 0; padding: 0; color: #222; font-family: 'Noto Sans JP', sans-serif; -webkit-text-size-adjust: none; }

#wrap { margin: 0 auto; width: 100%; position: relative; overflow: hidden; }

img.f-width { width: 100%; }

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
***For SmartPhone ***/
header { margin: 0 auto; width: 100%; background: url(../img/top_bg_sp.jpg) no-repeat center bottom; background-size: 100% auto; }

header div#langNavi { margin: 0 auto; width: 100%; height: 6.66667vw; background: #fff; }

header div#langNavi ul.fbox { margin-right: 2.13333vw; height: 100%; -ms-flex-pack: end; -webkit-box-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; -ms-flex-align: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; }

header div#langNavi ul.fbox li { margin-left: 0.66667vw; width: 5.6vw; height: 3.46667vw; border: solid 1px #f94c9e; line-height: 2.93333vw; font-size: 2.13333vw; font-weight: 300; text-align: center; color: #f94c9e; -webkit-border-radius: 1.73333vw; border-radius: 1.73333vw; }

header div#langNavi ul.fbox li a { text-decoration: none; color: #f94c9e; }

header div#top-visual { margin: 0 auto; position: relative; height: 84vw; }

header div#top-visual h1 { margin: 0 auto; width: 62.93333%; position: absolute; top: 1.066vw; left: 0; right: 0; z-index: 3; }

header div#top-visual p { margin: 0 auto; width: 41.6%; position: absolute; top: 34.933vw; left: 0; right: 0; z-index: 5; }

header div#top-visual ul.btnBox { margin: 0 auto; font-size: 0; text-align: center; position: absolute; bottom: 3.33333vw; left: 0; right: 0; z-index: 10; }

header div#top-visual ul.btnBox li { display: inline-block; margin: auto 0.53333vw; width: 23.2vw; }

div#mainContainer { margin: 0 auto; width: 100%; position: relative; }

div#mainContainer section { margin: 0 auto; position: relative; }

div#mainContainer section > article { position: relative; margin: 0 auto; padding-bottom: 5.33333vw; width: 73.06667vw; text-align: center; background: url(../img/separator-line.png) no-repeat center bottom; background-size: 71.86667vw auto; }

div#mainContainer section > article h1, div#mainContainer section > article h2 { margin: 8vw auto 6.66667vw; }

div#mainContainer section > article p { margin: 0 auto 4.26667vw; width: 68.8vw; font-size: 3.46667vw; font-weight: 300; color: #592a64; line-height: 1.2; text-align: center; }

div#mainContainer section > article p br.pc { display: none; }

div#mainContainer section > article p strong { color: #f94c9e; font-weight: 300; }

div#mainContainer section > article div.tex-pc { display: none; }

div#mainContainer section > article dl.info { margin: 0 0 0 auto; width: 47.33333vw; }

div#mainContainer section > article dl.info dt { margin: 0 auto 3.2vw; font-size: 4vw; font-weight: 700; color: #f94c9e; }

div#mainContainer section > article dl.info dd p { width: auto; }

div#mainContainer section > article ul#preview li { position: relative; }

div#mainContainer section > article ul#preview li article { margin: 0 auto; padding: 0 3.6vw; width: 53.86667vw; position: relative; }

div#mainContainer section > article ul#preview li article h2 { margin-bottom: 2.13333vw; padding-top: 4.8vw; position: relative; z-index: 3; }

div#mainContainer section > article ul#preview li article h2::after { content: ' '; display: block; margin: 2.4vw auto 0; width: 17.06667vw; height: 2px; background: #f94c9e; }

div#mainContainer section > article ul#preview li article p { width: auto; white-space: nowrap; overflow: visible; letter-spacing: -0.04em; position: relative; z-index: 3; }

div#mainContainer section > article ul#preview li article div.phone { display: block !important; height: 94.93333vw; padding: 10.8vw 2.4vw 0; background: url(../img/phone.png) no-repeat center top; background-size: auto 100%; position: relative; z-index: 5; }

div#mainContainer section > article ul#preview li article::before { content: ' '; display: block; margin: 0 auto; width: 100%; height: 88vw; border: solid 2px #f94c9e; background: #fff; -webkit-border-radius: 3.2vw; border-radius: 3.2vw; left: 0; right: 0; position: absolute; z-index: 1; }

div#mainContainer section > article ul#voice { padding-top: 2.666vw; }

div#mainContainer section > article ul#voice li { position: relative; }

div#mainContainer section > article ul#voice li article { margin: 0 auto; width: 53.86667vw; height: 36vw; position: relative; }

div#mainContainer section > article ul#voice li article h3 { margin: 0 auto 3.33333vw; padding-top: 4.8vw; position: relative; z-index: 3; }

div#mainContainer section > article ul#voice li article h3::after { content: ' '; display: block; margin: 3.73333vw auto 0; width: 17.33333vw; height: 2px; background: #f94c9e; }

div#mainContainer section > article ul#voice li article p { width: auto; letter-spacing: -0.04em; position: relative; z-index: 3; }

div#mainContainer section > article ul#voice li article::before { content: ' '; display: block; margin: 0 auto; width: 100%; height: 96%; border: solid 2px #f94c9e; background: #fff; -webkit-border-radius: 3.2vw; border-radius: 3.2vw; left: 0; right: 0; position: absolute; z-index: 1; }

div#mainContainer section > article ul#user { padding-top: 2.666vw; }

div#mainContainer section > article ul#user li { position: relative; }

div#mainContainer section > article ul#user li article { margin: 0 auto; width: 53.86667vw; height: 46vw; position: relative; }

div#mainContainer section > article ul#user li article h3 { margin: 0 auto 3.33333vw; padding-top: 4.8vw; position: relative; z-index: 3; }

div#mainContainer section > article ul#user li article h3::after { content: ' '; display: block; margin: 3.73333vw auto 0; width: 17.06667vw; height: 2px; background: #f94c9e; }

div#mainContainer section > article ul#user li article div { margin: 0 auto; width: 23.46667vw; position: relative; z-index: 5; }

div#mainContainer section > article ul#user li article::before { content: ' '; display: block; margin: 0 auto; width: 100%; height: 96%; border: solid 2px #f94c9e; background: #fff; -webkit-border-radius: 3.2vw; border-radius: 3.2vw; left: 0; right: 0; position: absolute; z-index: 1; }

div#mainContainer section > article::before, div#mainContainer section > article::after { content: ""; display: block; position: absolute; }

div#mainContainer section#topBox { padding-top: 4vw; }

div#mainContainer section#topBox > article:nth-of-type(1)::before { width: 10.4vw; height: 23.866vw; background: url(../img/kira01_sp.png) no-repeat center top; background-size: 100% auto; top: -7.466vw; left: -8vw; }

div#mainContainer section#topBox > article:nth-of-type(2)::before { width: 13.6vw; height: 24.666vw; background: url(../img/kira02_sp.png) no-repeat center top; background-size: 100% auto; top: -22.8vw; right: -6vw; }

div#mainContainer section#topBox > article:nth-of-type(2)::after { width: 10.933vw; height: 19.733vw; background: url(../img/kira03_sp.png) no-repeat center top; background-size: 100% auto; bottom: 20.4vw; left: -6vw; }

div#mainContainer section#botmBox > article { padding-bottom: 8vw; }

div#mainContainer section#botmBox > article:nth-of-type(2)::before { width: 10.933vw; height: 19.733vw; background: url(../img/kira04_sp.png) no-repeat center top; background-size: 100% auto; top: -5.333vw; right: -7.2vw; }

div#mainContainer section#botmBox > article:nth-of-type(2)::after { width: 15.066vw; height: 34.533vw; background: url(../img/kira05_sp.png) no-repeat center top; background-size: 100% auto; bottom: 4.266vw; left: -12.4vw; }

div#mainContainer section#botmBox > article:nth-of-type(3)::before { width: 14.4vw; height: 31.466vw; background: url(../img/kira06_sp.png) no-repeat center top; background-size: 100% auto; top: 26vw; right: -8.933vw; }

div#mainContainer section#botmBox::before { content: ""; display: block; width: 100%; height: 88.93333vw; position: absolute; background: url(../img/botm_bg_sp.png) no-repeat left top; background-size: 57.6vw auto; top: -9.6vw; z-index: 0; }

div#mainContainer section#footBox > article { background: none; }

div#mainContainer section#footBox > article ul.dl-btn { margin: 0 auto; font-size: 0; }

div#mainContainer section#footBox > article ul.dl-btn li { display: inline-block; margin: 0 0.93333vw; width: 24.26667vw; vertical-align: top; }

div#mainContainer section#footBox > article ul.dl-btn li p { margin: 0.66667vw auto 0; width: auto; font-size: 2.13333vw; font-family: 'Gill Sans', sans-serif; color: #000; }

footer { margin: 2.66667vw auto; width: 100%; text-align: center; }

footer ul.sns { margin: 0 auto; font-size: 0; }

footer ul.sns li { display: inline-block; margin: 0 3.33333vw; height: 5.6vw; }

footer ul.sns li a img { height: 100%; }

footer p.copyright { margin: 3.2vw auto; font-size: 2.4vw; font-weight: 300; color: #666; }

.slick-dots li { margin: 0 1px !important; }

.slick-dots li button:before, .slick-dots li.slick-active button:before { color: #f94c9e !important; font-size: 11px !important; }

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width: 768px) { header { background: url(../img/top_bg_pc_v2.jpg) no-repeat center bottom; background-size: auto 35.17588vw; }
  header div#langNavi { height: 50px; max-width: 995px; }
  header div#langNavi ul.fbox { margin-right: 16px; }
  header div#langNavi ul.fbox li { margin-left: 5px; width: 42px; height: 26px; line-height: 22px; font-size: 16px; -webkit-border-radius: 13px; border-radius: 13px; }
  header div#top-visual { max-width: 995px; height: 35.175vw; }
  header div#top-visual h1 { width: 37.185%; top: 9.142%; left: 4.522%; right: auto; }
  header div#top-visual p { width: 29.547%; top: 72.857%; left: 8.241%; right: auto; }
  header div#top-visual ul.btnBox { width: 36.181%; max-width: 366px; bottom: 8.571%; left: auto; right: 9.045%; }
  header div#top-visual ul.btnBox li { margin: auto 0.301%; width: 17.48vw; max-width: 174px; }
  div#mainContainer { max-width: 995px; }
  div#mainContainer section { margin: 0 auto; }
  div#mainContainer section > article { padding-bottom: 36px; /*width: 74.77%; max-*/ width: 744px; background-size: 539px auto; }
  div#mainContainer section > article h1, div#mainContainer section > article h2 { margin: 60px auto 50px; }
  div#mainContainer section > article p { margin: 0 auto 26px; width: 744px; font-size: 22px; font-weight: 100; }
  div#mainContainer section > article p br.sp { display: none; }
  div#mainContainer section > article p br.pc { display: block; }
  div#mainContainer section > article p strong { font-weight: 100; }
  div#mainContainer section > article div.tex-sp { margin-bottom: 26px; }
  div#mainContainer section > article div.tex-sp p { margin-bottom: 0; display: inline; }
  div#mainContainer section > article div.tex-pc { display: block; }
  div#mainContainer section > article dl.info { margin: 0 0 0 auto; width: 432px; text-align: left; }
  div#mainContainer section > article dl.info dt { margin: 0 auto 24px; font-size: 24px; }
  div#mainContainer section > article dl.info dd { margin-bottom: 32px; }
  div#mainContainer section > article dl.info dd p { width: auto; text-align: left; margin-bottom: 0; letter-spacing: -0.02em; }
  div#mainContainer section > article ul#preview li article { padding: 0 20px; width: 283px; }
  div#mainContainer section > article ul#preview li article h2 { margin-bottom: 16px; padding-top: 40px; }
  div#mainContainer section > article ul#preview li article h2::after { margin: 18px auto 0; width: 128px; }
  div#mainContainer section > article ul#preview li article p { margin-bottom: 28px; font-size: 18px; }
  div#mainContainer section > article ul#preview li article div.phone { display: block !important; height: 494px; padding: 56px 13px 0; background: url(../img/phone.png) no-repeat center top; background-size: auto 100%; position: relative; z-index: 5; }
  div#mainContainer section > article ul#preview li article::before { height: 458px; -webkit-border-radius: 24px; border-radius: 24px; }
  div#mainContainer section > article ul#voice { padding-top: 0; }
  div#mainContainer section > article ul#voice li article { padding: 0 13px; width: 287px; height: 229px; }
  div#mainContainer section > article ul#voice li article h3 { margin: 0 auto 35px; padding-top: 36px; }
  div#mainContainer section > article ul#voice li article h3::after { margin: 35px auto 0; width: 128px; }
  div#mainContainer section > article ul#voice li article p { margin-bottom: 28px; font-size: 18px; }
  div#mainContainer section > article ul#voice li article::before { height: 225px; -webkit-border-radius: 24px; border-radius: 24px; }
  div#mainContainer section > article ul#user { padding-top: 0; }
  div#mainContainer section > article ul#user li article { padding: 0 13px; width: 287px; height: 359px; }
  div#mainContainer section > article ul#user li article h3 { margin: 0 auto 35px; padding-top: 36px; }
  div#mainContainer section > article ul#user li article h3::after { margin: 42px auto 0; width: 128px; }
  div#mainContainer section > article ul#user li article div { width: 176px; }
  div#mainContainer section > article ul#user li article::before { height: 355px; -webkit-border-radius: 24px; border-radius: 24px; }
  div#mainContainer section#topBox { padding-top: 0; }
  div#mainContainer section#topBox > article:nth-of-type(1)::before { width: 145px; height: 283px; background: url(../img/kira01_pc.png) no-repeat center top; background-size: 100% auto; top: auto; bottom: -237px; left: -90px; }
  div#mainContainer section#topBox > article:nth-of-type(2)::before { width: 152px; height: 245px; background: url(../img/kira02_pc.png) no-repeat center top; background-size: 100% auto; top: auto; bottom: -59px; right: -112px; }
  div#mainContainer section#topBox > article:nth-of-type(2)::after { display: none; }
  div#mainContainer section#botmBox > article:nth-of-type(2), div#mainContainer section#botmBox > article:nth-of-type(3), div#mainContainer section#botmBox > article:nth-of-type(4) { width: 100%; padding: 8px 15px 70px; }
  div#mainContainer section#botmBox > article:nth-of-type(2) > h2, div#mainContainer section#botmBox > article:nth-of-type(3) > h2, div#mainContainer section#botmBox > article:nth-of-type(4) > h2 { width: 744px; }
  div#mainContainer section#botmBox > article:nth-of-type(2)::before { display: none; }
  div#mainContainer section#botmBox > article:nth-of-type(2)::after { display: none; }
  div#mainContainer section#botmBox > article:nth-of-type(3)::before { width: 82px; height: 148px; background: url(../img/kira03_pc.png) no-repeat center top; background-size: 100% auto; top: -28px; left: 47px; }
  div#mainContainer section#botmBox > article:nth-of-type(4)::before { width: 102px; height: 185px; background: url(../img/kira04_pc.png) no-repeat center top; background-size: 100% auto; top: -58px; right: 62px; }
  div#mainContainer section#botmBox::before { width: 64.22111vw; max-width: 639px; height: 1288px; background: url(../img/botm_bg_pc.png) no-repeat left top; background-size: 100% auto; top: -11px; }
  div#mainContainer section#footBox > article { background: none; }
  div#mainContainer section#footBox > article ul.dl-btn li { margin: 0 10px; width: 238px; }
  div#mainContainer section#footBox > article ul.dl-btn li p { margin: 7px 0; font-size: 20px; }
  div#mainContainer section#footBox > article::before { width: 145px; height: 283px; background: url(../img/kira05_pc.png) no-repeat center top; background-size: 100% auto; top: -54px; left: -47px; }
  footer { margin: 0 auto; }
  footer ul.sns { margin: 0 auto; font-size: 0; }
  footer ul.sns li { margin: 0 33px; height: 52px; }
  footer p.copyright { margin: 36px auto; font-size: 11px; } }

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media screen and (min-width: 995px) { header { background-size: auto 350px; }
  header div#top-visual { max-width: 995px; height: 350px; } }
