@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_instagram p,.heder {
  box-sizing: border-box;
  margin:0;
  padding: 0;
}
*/
.lp_shokansen_instagram p,
.lp_shokansen_instagram h1,
.lp_shokansen_instagram h2,
.lp_shokansen_instagram h3,
.lp_shokansen_instagram h4,
.lp_shokansen_instagram ul,
.lp_shokansen_instagram li,
.lp_shokansen_instagram ol,
.lp_shokansen_instagram dl,
.lp_shokansen_instagram dt,
.lp_shokansen_instagram dd,
.lp_shokansen_instagram .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_instagramで絞り込んで初期化*/

/*============================
common
============================*/

.lp_shokansen_instagram {
  max-width: 750px;
  margin: 0 auto;
}

.lp_shokansen_instagram .p-box {
  position: relative;
}

.lp_shokansen_instagram img {
  display: block;
  width: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  vertical-align: top;
}

#body_wrapper .lp_shokansen_instagram a {
  display: inline-block;
  -webkit-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
}
#body_wrapper .lp_shokansen_instagram a:hover {
  opacity: 0.7;
}
/*============================
contents
============================*/

.fv.lp_shokansen_instagram .top_wrap {
  position: relative;
}

.fv.lp_shokansen_instagram h1 {
  position: absolute;
  width: 100%;
  top:17%;
}
.fv.lp_shokansen_instagram h1 img {
  filter: drop-shadow(0 0 5px rgba(255,255,255,1));
}



.lp_shokansen_instagram .btn_anime {
  animation: btnScalingAnime 0.6s ease 0s infinite alternate;
  position: absolute;
  cursor: pointer;
}

@keyframes btnScalingAnime {
  from {
    transform: scale(0.95,0.95);
  }
  to {
    transform: scale(1,1);
  }
}


.lp_shokansen_instagram .btn_fv_offer {
  width: 83.2%;
  left:9%;
  bottom:21%;
}

.lp_shokansen_instagram .btn_sns_offer {
  width: 96.93%;
  left:2%;
  bottom:26%;
}

.lp_shokansen_instagram .btn_efficacy_offer  {
  width: 96.93%;
  left:2%;
  bottom:29%;
}

.lp_shokansen_instagram .btn_faq_offer  {
  width: 96.93%;
  left:2%;
  bottom:32%;
}

.lp_shokansen_instagram .btn_close6_offer   {
  width: 81.73%;
  left:9.13%;
  bottom:40%;
}

.lp_shokansen_instagram .btn_close3_offer   {
  width: 81.73%;
  left:9.13%;
  bottom:46%;
}

.lp_shokansen_instagram .btn_close1_offer  {
  width: 96.93%;
  left:2%;
  bottom:42%;
}

.lp_shokansen_instagram .btn_single_offer  {
  width: 42.67%;
  right:7%;
  bottom:61%;
}

/* accordion */

.lp_shokansen_instagram .accordion01 {
  background-image: url(../images/faqoffer_01.jpg);
  background-size:300% auto;
  background-repeat: repeat-y;
}
.lp_shokansen_instagram .accordion01 .accordion_head {
  position: relative;
}
.lp_shokansen_instagram .accordion01 .accordion_head img {
  position: relative;
  width: 48%;
  margin: 0 auto;
  padding:3% 0;
  cursor: pointer;
}

.lp_shokansen_instagram .accordion01 .accordion_head::after {
    content: '';
    position: absolute;
    background-image: url(../images/icon_acc_close.png);
    background-size: contain;
    padding-top: 2%;
    width: 2.53%;
    top: 43%;
    right: 29%;
}

.lp_shokansen_instagram .accordion01 .accordion_head.active::after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
  top:40%;
}

.lp_shokansen_instagram .accordion01 .accordion_inner {
  padding:0 3% 5%;
}