@charset "UTF-8";
/* CSS Document */

/*-----------------
common
-----------------*/
*{margin:0;padding:0;box-sizing:border-box;}
html{font-size:62.5%;}
body{color:#000000;font-size:14px;font-size:1.4rem;font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}
img{vertical-align:middle;max-width:100%;height:auto;border: 0;}
a{text-decoration:none;color:#0066c2;transition: all .1s ease-out,color .1s ease-out;}
a:hover{opacity:0.7;filter:alpha(opacity=70);-ms-filter:"alpha(opacity=70)";-moz-opacity:0.7;-khtml-opacity:0.7;}
ul,ol,li {list-style: none;}
.f28 {font-size: 28px;font-size: 2.8rem;line-height: 1.2}
.f22 {font-size: 22px;font-size: 2.2rem}
.f18 {font-size: 18px;font-size: 1.8rem}
.f16 {font-size: 16px;font-size: 1.6rem}
.f14 {font-size: 14px;font-size: 1.4rem}
.f12 {font-size: 12px;font-size: 1.2rem}
.f10 {font-size: 10px;font-size: 1.0rem}
.margin5 {margin-top: 5px}
.margin10 {margin: 10px 0 30px;}
.yellow {background: url(images/bg.png);padding: 1em;}
.border_yellow {border-bottom: 5px solid #F9D72D;padding: 0 15px 5px;display: inline-block;margin: 0 0 10px 0;}
.span_yellow {background: #F9D72D;display: inline-block;vertical-align: middle;padding: 2px 10px;margin: 0 10px 0 0;border-radius: 20px;}
.align_center {text-align: center;
}
.btn {
  background: url(images/bg2.png);
  padding: 10px;
  border-radius: 24px;
  display: block;
  color: #fff;
  font-size: 16px;
  font-size: 1.6rem;
  margin: 30px auto 0;
  width: 30%;
  text-align: center;
}
.btn_shop {
  width: 7em;
  display: inline-block;
  vertical-align: middle;
  margin: 0 0 0 20px;
  font-size: 14px;
  font-size: 1.4rem;
  background: url(images/bg4.png);
}
.btn.btn_odekake {
  background: #fccf00;
  border-radius: 0;
  color: #000;
  border: 3px solid #000;
  margin: 50px auto 80px;
  width: 50%;
  padding: 1em;
}
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix { display: inline-table;}
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/*-----------------
header
-----------------*/
#container {width: 100%;}
.logo {
  max-width: 980px;
  position: relative;
  line-height: 40px;
  margin: 0 auto;
}
.logo img {margin: 0 15px 0 0;}
.backtop {
  position: absolute;
  top: 0;
  right: 0;
}
.backtop a {
  background: #009FE8;
  color: #fff;
  padding: 0 15px;
  display: inline-block;
}
#title {
  color: #fff;
  background: #0066c2;
  line-height: 1.5;
  padding: 0.5em 0;
}
#title a {color: #fff;}
#title h1 {
  max-width: 980px;
  margin: 0 auto;
  font-size: 26px;
  font-size: 2.6rem;
}
.eyecatch {
  text-align: center;
  background: url(images/bg.png);
  padding: 20px 2em;
}
.eyecatch div {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: end;
}
.eyecatch div a {
  width: 32%;
  margin-right: 2%;
  max-width: 314px;
}
.eyecatch div>img {
  width: calc(100% - 32% - 2%);
  max-width: 551px;
}

/*-----------------
nav
-----------------*/
.top_menu {
  margin: 20px auto 5em;
  max-width: calc(980px + 4em);
  padding: 0 2em;
}
.top_menu a {
  color: #fff;
}
.nav_left {
  display: flex;
  justify-content: space-between;
  margin: 0 0 1em;
  flex-wrap: wrap;
}
.nav_left p {
  line-height: 1.2;
}
.nav_left img {
  margin: 0 0 .5em;
}
.nav_left>div {
  width: 32.5%;
  display: flex;
  background: url(images/bg2.png);
  -moz-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -webkit-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -o-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -ms-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  border-radius: 20px;
  align-items: center;
}
.nav_left a {
  width: 100%;
  padding: 2em 1em;
  text-align: center;
  font-weight: bold;
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.nav_bottom {
  display: flex;
  justify-content: space-between;
  margin: 0 0 1em;
  flex-wrap: wrap;
}

.nav_bottom>div {
  width: 32.5%;	
  display: flex;
  justify-content: space-between;
  text-align: center;
  flex-wrap: wrap;
}
.nav_bottom a {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-wrap: wrap;
}
.nav_bottom a p {
  margin: auto;
}
.nav_bottom1 {
  font-weight: bold;
  background-image: url(images/bg3.png);
  padding: 2em;
  border-radius: 20px;
  color: #fff;
  -moz-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -webkit-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -o-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -ms-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  box-shadow: 0 3px 0 rgba(0,0,0,0.2);
}
.nav_bottom2 {
  text-align: center;
  background-image: url(images/bg4.png);
  padding: 2em;
  border-radius: 20px;
  color: #fff;
  -moz-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -webkit-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -o-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  -ms-box-shadow: 0 3px 0 rgba(0,0,0,0.2);
  box-shadow: 0 3px 0 rgba(0,0,0,0.2);
}
.nav_bottom2 .mv_w span {
  color: #8dc21f;
}
.nav_bottom1 .mv_w span {
  color: #1aa0e5;
}

/* pnkz */
.pnkz {
  margin: 1em 2em;
}
.pnkz ul {
  max-width: 980px;
  margin: 0 auto;
}
.pnkz li {
  display: inline-block;
  vertical-align: middle;
}
.pnkz li:after {
  content: "＞";
  margin: -3px 1em 0;
  font-size: 8px;
  font-size: 0.8rem;
  display: inline-block;
  vertical-align: middle;
}
.pnkz li:last-child:after {
  display: none;
}

/* member */
.blog .member {
  margin: 60px auto;
}
.member_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 2em auto;
  width: 88%;
}
.member_list li {
  margin: 0 1% 2%;
  width: 31%;
}

/*-----------------
main
-----------------*/
.endTitle{
  background: #eee;
  color: #999;
  padding: 10px;
  margin-top: 30px;
  text-align: center;
}
article>div {
  margin: 0 auto 100px;
  max-width: 980px;
  position: relative;
}
article div h2 {
  margin: 0 0 15px;
  background: url(images/bg.png);
  padding: 12px;
  border-radius: 3px;
  font-size: 24px;
  font-size: 2.4rem;
}
.pickup {
  background: #fff;
  font-weight: normal;
  display: inline-block;
  padding: 10px;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  width: 210px;
  border-radius: 20px;
  vertical-align: middle;
  margin: -6px 10px 0px 0;
}
.blog>div {
  margin: 0 auto 140px;
}
.blog div div {
  text-align: center;
}
.blog.datail>div {
  margin: 0 auto 140px;
  max-width: calc(980px + 4em);
  padding: 2em;
}
.blog.datail ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.blog.datail li {
  width: 32%;
  margin-bottom: 2em;
}
.blog.datail li a {
  width: 32%;
  margin-bottom: 2em;
}
.datail li a img {
  object-fit: cover;
  width: 100%;
  height: 270px;;
}
.end {
  background: #eee;
  color: #999;
  padding: 10px;
  margin: 0 0 14px;
}
.com {
  background: #e50012;
  color: #fff;
  padding: 5px 10px;
  margin: -12px -12px 14px;
  text-align: center;
}
.left {
  float: left;
  margin: 0 2% 0 0;
}
.right {
  float: right;
}
.width49 {
  width: 49%;
}
.width32 {
  width: 32%;
}

/*-----------------
footer
-----------------*/
#pagetop {
  text-align: center;
}
footer {
  background: #565656;
  color: #fff;
  padding: 50px 2em 0;
}
footer>div {
  max-width: 980px;
  margin: 0 auto 40px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.fotter_listWrap {
  width: 49%;
}
.fotter_listWrap ul {
  display: flex;
  vertical-align: top;
  margin: 30px 0 0 0;
  padding: 0 1.2em 0 0;
  flex-wrap: wrap;
  justify-content: space-between;
}
.fotter_listWrap li {
  margin: 0 1em 1em 0;
  width: calc(33% - 1em);
  font-size: 1.1vw;
}
.fotter_listWrap a {
  color: #fff;
}
.fotter_listWrap a:hover {
  color: #fff;
}
.footer_logo {
  width: 49%;
  margin: 0 auto;
  text-align: center;
  border-left: 1px solid #ccc;
  padding: 0 0 0 1em;
}
.footer_logo dt {
  margin: 0 0 20px 0;
  text-align: center;
}
.footer_logo dd {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.footer_logo dd p {
  margin: 0 0 4%;
  width: 49%;
}
.footer_logo dd a {
  background: #F9D72D;
  color: #000000;
  padding: 14px 0;
  display: block;
  border-radius: 50px;
}
.footer_logo dd a:hover {
  background: #fff;
  opacity: 1;
  -ms-filter: "alpha(opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
}

/*-----------------
コピーライト
-----------------*/
.copy-back {
  background: #565656;
  color: #fff;
  text-align: center;
  border-top: 1px solid #999;
  padding: 15px 0;
}
.copy-back span {
  width: 980px;
  margin: 0 auto;
  line-height: 2;
}

@media screen and (max-width: 640px) {
  #container {
    width: auto;
    overflow: hidden;
  }
  .comment {
    width: auto;
    font-size: 14px;
    font-size: 1.4rem;
    padding: 1em;
    margin: 1em 1em 0;
  }
  .eyecatch,
  #title h1 {
    width: auto;
    padding: 0 1em;
  }
  .logo {width: auto;padding: 0 1em 1em;line-height: 1.2;}
  #title {padding:1em 0.5em;}
  .logo img {width: 100px;display: block;padding: 10px 0 15px;}
  #title h1 {font-size:20px;font-size:2.0rem;}
  .eyecatch div {
    width: auto;
    padding: 20px 0 0;
  }
  .eyecatch div img {
    margin: 0 0 1em 0;
  }
  .backtop a {
    line-height: 40px;
  }
  .top_menu {
    display: block;
  }
	
.nav_left {
  margin: 0;
}
	
	
  .nav_left a {
    padding: 1em;
  }
  .nav_left img {
    margin: 0 0 0.5em;
  }
  .nav_left p {
    font-size: 16px;
    font-size: 1.6rem;
    margin: 0;
  }
  .nav_left p br {
    display: none;
  }
	
  .nav_bottom a {
    padding: 1em;
  }
  .nav_bottom img {
    margin: 0 0 0.5em;
  }
  .nav_bottom p {
    font-size: 16px;
    font-size: 1.6rem;
    margin: 0;
  }
  .nav_bottom p br {
    display: none;
  }
	
	
	
	
  .nav_right {
    margin: 0 2em;
  }
  .nav_right1 {
    padding: 1em;
    margin: 0 0 1em;
    width: 100%;
    height: auto;
  }
  .nav_right1 a {
    width: 100%;
    box-sizing: border-box;
    margin: 5px 0;
    font-size: 12px;
    font-size: 1.2rem;
  }
  .nav_right2 {
    text-align: center;
    border-radius: 20px;
    width: 100%;
  }
  .nav_right2 p {
    font-size: 12px;
    font-size: 1.2rem;
  }
  .nav_right2 a {
    height: auto;
  }
  .car_left {
    width: 50%;
  }
  .blog>div {
    margin: 4em 0 0;
  }
  article>div {
    max-width: 640px;
    width: auto;
    padding: 0 1em;
    margin: 2em 0;
  }
  article div p {
    text-align: center;
  }
  article div h2 {
    font-size: 16px;
    font-size: 1.6rem;
    padding: 0.5em 1em;
  }
  article div h2 span {
    margin: 0 0 3px;
  }
  .blog div p img {
    position: static;
  }
  .blog div p img {
    width: 30%;
  }
  .blog div div p {
    text-align: left;
  }
  .pickup {
    display: block;
    width: auto;
    margin: 0.5em 0;
    font-size: 12px;
    font-size: 1.2rem;
    padding: 5px;
  }
  .btn {
    width: auto;
    margin: 1em 0 2em;
  }
  footer>div {
    width: auto;
    padding: 0 1em;
  }
  footer dd p {
    margin: 0 0 1% 0;
    width: 49%;
    font-size: 2.5vw;
  }
  .fotter_listWrap {
    width: 100%;
  }
  .fotter_listWrap p {
    text-align: center;
    margin: 0 0 1em 0;
  }
  .fotter_listWrap ul {
    width: 100%;
    padding: 0;
  }
  .fotter_listWrap li {
    margin: 0 1em 1em 0;
    width: calc(49% - 1em);
    font-size: 3vw;
  }
  .fotter_listWrap li:nth-child(2n) {
    margin: 0 0 1em 0;
  }
  .footer_logo {
    display: block;
    width: auto;
    border-left: 0;
    border-top: 1px solid #FFE3E7;
    padding: 2em 0 0;
  }
  .footer_logo a {
    white-space: normal;
  }
  .copy-back {padding: 1em;text-align: left;}
  .copy-back p {width: auto;}
  .member_list {
    width: auto;
    margin: 2em;
  }
  .member_list li {
    width: 46%;
  }
}

/* datail04 */
.blog .d4_title {
  background-color: #fccf00;
  display: flex;
  padding: 30px 2em;
  justify-content: center;
  max-width: 100%;
  margin: 0;
}
.blog .b4_title_l {
  align-self: center;
  margin: 0 2em 0 0;
}
.blog .b4_title_l img {
  display: block;
  margin: 1em 0;
}
.blog .b4_title_r {
  align-self: center;
}
.blog .d4_menu {
  background: #000;
  width: auto;
  margin: 0;
  padding: 2em 2em 1em;
  position: relative;
}
.d4_menu:after {
  content: "";
  border-top: 30px solid #000;
  border-right: 30px solid transparent;
  border-left: 30px solid transparent;
  position: absolute;
  bottom: -30px;
  left: 0;
  right: 0;
  margin: auto;
  width: 0;
  z-index: 1;
}
.d4_menu ul {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.d4_menu ul li {
  width: 23%;
  margin: 0 0 1.5em 0;
}
.d4_menu ul span,
.d4_menu ul a {
  text-align: center;
  font-size: 14px;font-size: 1.4rem;
  font-weight: bold;
  padding: 1em 0;
  margin: 0;
  display: block;
}
.d4_menu ul span {
  background: #fff;
  display: block;
}
.d4_menu ul a {
  background: #fccf00;
  border-radius: 0;
  color: #000;
}
.d4_menu ul li:nth-child(4n) {
  margin: 0
}
.blog.datail04 h2 {
  text-align: center;
  background: none;
  background-color: #fccf00;
  padding: 1em 2em 1em;
}
.blog.datail04 h2:first-child {
  padding: 40px 2em 1em
}
.blog .d4_main {
  margin: 0 auto;
  position: relative;
  max-width: 100%;
}
.blog .d4_main div img {
  display: inline-block;
  vertical-align: middle;
}
.emoticons {
  width: 24px;
  height: 24px;
  vertical-align: sub !important;
}
.d4_main .f16 {
  max-width: 980px;
  margin: 0 auto 80px;
}
.mv_w {
  width: 100%;
}
.mv_w  span {
  background-color: #fff;
  font-weight: normal;
  border-radius: 50px;
  color: #e50012;
  padding: 3px 10px;
  display: inline-block;
  margin-bottom: 5px;
}

@media screen and (max-width: 640px) {
  .pnkz {
    font-size: 12px;
    font-size: 1.2rem;
  }
  .blog .d4_title {
    display: block;
  }
  .blog .b4_title_l {
    margin: 0;
  }
  .d4_menu ul {
    display: block;
  }
  .d4_menu ul li,
  .d4_menu ul li:nth-child(4n) {
    width: 100%;
    margin: 0 0 0.5em;
  }
  .blog .d4_main {
    padding: 0;
  }
  .d4_main .f16 {
    padding: 0 1em;
    font-size: 14px;
    font-size: 1.4rem;
  }
  .blog .d4_main div img {
    width: auto;
    height: auto;
  }
  .blog .d4_main div .emoticons {
    width: 24px;
    height: 24px;
    }
  .btn.btn_odekake {
    width: 100%;
    font-size: 4vw;
  }
  .blog.datail li {
    width: 49%;
    margin-bottom: 2em;
  }
  .datail li a img {
    height: 220px;
  }
  .nav_left>div {
    width: 100%;
    margin: 2% 0;
  }
	
  .nav_bottom>div {
    width: 100%;
    margin: 2% 0;
  }
	
}

.datail05 .main div {
  margin: 0 auto;
  max-width: calc(960px + 4em);
  text-align: center;
  padding: 3em 2em 6em;
}
#video_wrap {
  position: relative;
  width: 100%;
  padding-top: 56%;
}
#video_wrap > iframe,
#video_wrap > video {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.datail05.blog>div {
  margin: 0 auto 100px;
}

/* shop_movie */
.blog .shop_movie {
  background-color: #70ad47;
  padding: 30px 2em;
  margin: 0 auto;
  text-align: center;
  max-width: 100%
}
.blog .shop_movie {
  align-self: center;
  margin: 0 2em 0 0
}
.blog .b13_title_l img {
  display: block;
  margin: 1em 0
}
.blog .b13_title_r {
  align-self: center
}
.blog .shop_movie_menu {
  background: url(images/bg.png);
  width: auto;
  margin: 0 0 2em;
  padding: 2em 2em 1em;
  position: relative
}
.shop_movie_menu ul {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between
}
.shop_movie_menu ul li {
  width: 23%;
  margin: 0 0 1.5em
}
.shop_movie_menu ul a, .shop_movie_menu ul span {
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 700;
  padding: 1em 0;
  margin: 0;
  display: block
}
.shop_movie_menu ul span {
  background: #ffc000;
  display: block
}
.shop_movie_menu ul a {
  background: #fff;
  border-radius: 0;
  color: #000
}
.shop_movie_menu ul li:nth-child(4n) {
  margin: 0
}
.blog.shop_movie h2 {
  text-align: center;
  background: 0;
  padding: 1em 2em;
  color: #009FE8;
}
.blog.shop_movie h2:after {
  content: "";
  width: 70px;
  height: 4px;
  background-color: #009FE8;
  margin: 10px auto 0;
  display: block;
  border-radius: 20px;
}
.blog.shop_movie h2 img {
  height: 53px;
  width: auto
}
.blog .shop_movie_main {
  margin: 0 auto;
  position: relative;
  max-width: 100%;
  text-align: center
}
.blog .shop_movie_main div img {
  display: inline-block;
  vertical-align: middle
}
.shop_movie_main .f16 {
  max-width: 980px;
  margin: 0 auto 5pc;
  padding: 0 2em
}
.btn.btn_odekake {
  border: 0;
  background: #ffc000;
}
@media screen and (max-width:640px) {
  .pnkz {
    font-size: 9pt;
    font-size: 1.2rem
  }
  .blog .shop_movie_title {
    display: block
  }
  .blog .b13_title_l {
    margin: 0
  }
  .shop_movie_menu ul {
    display: block
  }
  .shop_movie_menu ul li, .shop_movie_menu ul li:nth-child(4n) {
    width: 100%;
    margin: 0 0 .5em
  }
  .blog .shop_movie_main {
    padding: 0
  }
  .shop_movie_main .f16 {
    font-size: 14px;
    font-size: 1.4rem
  }
  .blog .shop_movie_main div img {
    width: auto;
    height: auto
  }
  .blog .shop_movie_main div .emoticons {
    width: 24px;
    height: 24px
  }
  .btn.btn_odekake {
    width: 100%;
    font-size: 4vw
  }
  .blog.shop_movie h2 img {
    height: 35px
  }
}