@charset "UTF-8";

/*

html5doctor.com Reset Stylesheet

v1.6.1

Last Updated: 2010-09-17

Author: Richard Clark - http://richclarkdesign.com

Twitter: @rich_clark

*/



html, body, div, span, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

abbr, address, cite, code,

del, dfn, em, img, ins, kbd, q, samp,

small, strong, sub, sup, var,

b, i,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, figcaption, figure,

header, hgroup, menu, nav, section, summary,

time, mark, audio, video {

    margin:0;

    padding:0;

    border:0;

    outline:0;

    font-size:100%;

    vertical-align:baseline;

    background:transparent;

}



footer{

    margin:0;

    padding:0;

    border:0;

    outline:0;

    font-size:100%;

    vertical-align:baseline;

}





article,aside,details,figcaption,figure,

footer,header,hgroup,menu,nav,section {

    display:block;

}



nav ul {

    list-style:none;

}



blockquote, q {

    quotes:none;

}



blockquote:before, blockquote:after,

q:before, q:after {

    content:'';

    content:none;

}



a {

    margin:0;

    padding:0;

    font-size:100%;

    vertical-align:baseline;

    background:transparent;

}



ins {

    background-color:#ff9;

    color:#000;

    text-decoration:none;

}



mark {

    background-color:#ff9;

    color:#000;

    font-style:italic;

    font-weight:bold;

}



del {

    text-decoration: line-through;

}



abbr[title], dfn[title] {

    border-bottom:1px dotted;

    cursor:help;

}



table {

    border-collapse:collapse;

    border-spacing:0;

}

input, select {

    vertical-align:middle;

}



ol, ul {

  list-style: none;

}

img {

  vertical-align: top;

  font-size:0;

  line-height: 0;

}

address {

  font-style: normal;

}





/*============================

Common

============================*/

body {

  margin: auto;

  width: 100%;

}



/* スクロールバーの色削除 */

html,

body {

  scrollbar-face-color: inherit !important;

}





/*.lp_shokansen_ig_femi p,.heder {

  box-sizing: border-box;

  margin:0;

  padding: 0;

}

*/

.lp_shokansen_ig_femi p,

.lp_shokansen_ig_femi h1,

.lp_shokansen_ig_femi h2,

.lp_shokansen_ig_femi h3,

.lp_shokansen_ig_femi h4,

.lp_shokansen_ig_femi ul,

.lp_shokansen_ig_femi li,

.lp_shokansen_ig_femi ol,

.lp_shokansen_ig_femi dl,

.lp_shokansen_ig_femi dt,

.lp_shokansen_ig_femi dd,

.lp_shokansen_ig_femi .header

{

  box-sizing: border-box;

  margin:0;

  padding: 0;

  border:none;

  line-height: 0;

  font-size: 0;

}



#body_wrapper {

    animation: fadeIn 1s ease 0s 1 normal;

    -webkit-animation: fadeIn 1s ease 0s 1 normal;

}



@keyframes fadeIn {

    0% {opacity: 0}

    100% {opacity: 1}

}



@-webkit-keyframes fadeIn {

    0% {opacity: 0}

    100% {opacity: 1}

}



/*.lp_shokansen_ig_femiで絞り込んで初期化*/



/*============================

common

============================*/



.lp_shokansen_ig_femi {

  max-width: 750px;

  margin: 0 auto;

}



.lp_shokansen_ig_femi .p-box {

  position: relative;

}



.lp_shokansen_ig_femi img {

  display: block;

  width: 100%;

  backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

  vertical-align: top;

}



#body_wrapper .lp_shokansen_ig_femi a {

  display: inline-block;

  -webkit-transition: opacity 0.5s ease-out;

  transition: opacity 0.5s ease-out;

}

#body_wrapper .lp_shokansen_ig_femi a:hover {

  opacity: 0.7;

}

/*============================

contents

============================*/



.lp_shokansen_ig_femi #movie_01 {

  width: 100%;

}



.lp_shokansen_ig_femi .voice_image_box {

  position: absolute;

  top: 0;

  width: calc(570/750 * 100%);

}



.lp_shokansen_ig_femi .insta_img:nth-child(1) {

  margin-bottom: 1.5%;

}



.lp_shokansen_ig_femi .insta_img {

  width: calc(280/570 * 100%);

}



.lp_shokansen_ig_femi .voice_image {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

}



.lp_shokansen_ig_femi .insta_img .img02 {

  position: absolute;

  top: 0;

}



.lp_shokansen_ig_femi .insta_img .anime01 {

  opacity: 0;

  -webkit-animation: anime 8s 0s infinite;

  animation: anime 8s 0s infinite;

}



.lp_shokansen_ig_femi .insta_img .anime01:nth-of-type(2) {

  animation-delay: 2s;

}



.lp_shokansen_ig_femi .insta_img .anime02 {

  opacity: 0;

  -webkit-animation: anime 8s 0s infinite;

  animation: anime 8s 0s infinite;

  animation-delay: -2s;

}



.lp_shokansen_ig_femi .insta_img .anime02:nth-of-type(2) {

  animation-delay: 2s;

}



/* ふわっとアニメーション */

@keyframes anime {

  0% {

    opacity: 0;

  }

  50% {

    opacity: 1;

  }

  100% {

    opacity: 0;

  }

}



@-webkit-keyframes anime {

  0% {

    opacity: 0;

  }

  50% {

    opacity: 1;

  }

  100% {

    opacity: 0;

  }

}



/* parallax */



.lp_shokansen_ig_femi .parallax_wrapper {

  display: block;

  position: relative;

  margin-top: 10.5%;

}

.lp_shokansen_ig_femi .parallax_wrapper .copy_main {

  width: calc(562/750 * 100%);

  margin: 0 auto;

  padding-bottom: 70%;

}

.lp_shokansen_ig_femi .parallax_wrapper .copy_sub {

  position: relative;

  width: calc(509/750 * 100%);

  margin: -5.5% auto 0;

  z-index: 100;

}



.lp_shokansen_ig_femi .copy_img {

  display: block;

  width: 375px;

  margin: 0 auto;

  left: 50%;

  transform: translateX(-50%);

}



.lp_shokansen_ig_femi .parallax {

	position: fixed;

	top: 150px;

	height: 517px;

	z-index: -1;

}



@media (max-width: 750px) {

  .lp_shokansen_ig_femi .copy_img {

    width: calc(375/750 * 100%);

  }

  

  .lp_shokansen_ig_femi .parallax {

    top: 100px;

    height: calc(517/750 * 100%);

  }

}



/* cv_btn */



.lp_shokansen_ig_femi .cv_btn {

  position: absolute;

  top: -3%;

  left: 50%;

  transform: translateX(-50%);

  width: calc(612/750 * 100%);

}



.lp_shokansen_ig_femi .cv_btn02 {

  position: absolute;

  width: calc(290/750 * 100%);

  top: 8.5%;

  left: 53.5%;

}



/* accordion */



.lp_shokansen_ig_femi .faq_accordion dl.accordion {

  margin-bottom: 4%;

}



.lp_shokansen_ig_femi .faq_accordion dl.accordion dt {

  position: relative;

  cursor: pointer;

}



.lp_shokansen_ig_femi .faq_accordion dl.accordion dd {

  display: none;

}



.lp_shokansen_ig_femi .faq_accordion dl.accordion dt::before {

  position: absolute;

  top: 0;

  bottom: 0;

  right: 7%;

  z-index: 1000;

  width: 3.5%;

  max-width: 3.5%;

  height: 2px;

  max-height: 2px;

  margin: auto 0;

  background: #fff;

  content: '';

}



.lp_shokansen_ig_femi .faq_accordion dl.accordion dt::after {

  position: absolute;

  top: 0;

  bottom: 0;

  right: 7%;

  z-index: 1000;

  width: 3.5%;

  max-width: 3.5%;

  height: 2px;

  max-height: 2px;

  margin: auto 0;

  background: #fff;

  transform: rotate(-90deg);

  transition: all 0.3s ease 0s;

  content: '';

}



.lp_shokansen_ig_femi .faq_accordion dl.accordion dt.selected:after {

  -webkit-transform: rotate(180deg);

  transform: rotate(180deg);

}



.lp_shokansen_ig_femi .component_accordion dl.accordion dt {

  width: calc(470/750 * 100%);

  margin: 10% auto 0;

  position: relative;

  cursor: pointer;

}



.lp_shokansen_ig_femi .component_accordion dl.accordion dd {

  display: none;

}



.lp_shokansen_ig_femi .component_accordion dl.accordion dt::after {

  position: absolute;

  top: 0;

  bottom: 0;

  right: 5.5%;

  z-index: 1000;

  width: 5.5%;

  max-width: 5.5%;

  height: 12px;

  margin: auto 0;

  content: '';

  /*background: transparent url(../images/acc_icon.png) no-repeat top center / cover;*/

}



.lp_shokansen_ig_femi .component_accordion dl.accordion dt.selected:after {

  -webkit-transform: rotate(180deg);

  transform: rotate(180deg);

  bottom: 5%;

}



@media (max-width: 750px) {

  .lp_shokansen_ig_femi .component_accordion dl.accordion dt::after {

    height: 1.75vw;

  }

}



/* banner */



#body_wrapper #fixedBtn {

  display: none;

  position: fixed;

  bottom: 0;

  left: 0;

  right: 0;

  max-width: 750px;

  margin: 0 auto;

  opacity: 1;

  -webkit-transition: opacity 0.5s;

  transition: opacity 0.5s;

  z-index: 1000;

}



#body_wrapper #fixedBtn .fixedBtn_link {

  margin: 0 auto;

  width: calc(722/750 * 100%);

  display: block;

  -webkit-transition: 0s;

  transition: 0s;

}



#body_wrapper .faq {

	background: #fff;

}



#body_wrapper .coupon-tap-area {

  background: #fff;

  width: calc(690/750 * 100%);

  margin: 0 auto;

  cursor: pointer;

}

