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

#feature_ .contents_inner_ div,
#feature_ .contents_inner_ h1,
#feature_ .contents_inner_ h2,
#feature_ .contents_inner_ p,
#feature_ .contents_inner_ ul,
#feature_ .contents_inner_ li,
#feature_ .contents_inner_ span{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  list-style: none;
  padding: 0;
  margin: 0;
}
#feature_ .contents_inner_ img{
  margin: 0;
  padding:0;
  vertical-align: bottom;
}
#feature_ .contents_inner_ a {
 filter:alpha(opacity=100);
  -ms-filter:"alpha(opacity=100)";
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  color:#404040;
  line-height:2.2;
}

#feature_ .contents_inner_ a:hover {
  filter:alpha(opacity=100);
  -ms-filter:"alpha(opacity=50)";
  opacity: 1.0;
  text-decoration:none;
}



.feature_ .contents_inner_ #lp_{max-width:1100px; width:100%; overflow: hidden; margin:0 auto;padding:0px;font-size:14px;font-family: 'Noto Sans JP', sans-serif; }
.feature_ .contents_inner_ #lp_ a{color:black; font-size:1.3em;}

.feature_ .contents_inner_ #lp_ img{display:block; margin:0 auto;}
.feature_ .contents_inner_ #lp_ ul{
 display: block;
 margin:0 auto;
 padding:0px;
	margin-top:0px;
 padding-top: 0px;
 letter-spacing: -0.4em;
	text-align: center;
	
}
.feature_ .contents_inner_ #lp_ ul li{
	list-style: none;
display: -moz-inline-box;
  display: inline-block;
  *display:inline;
  *zoom: 1;
  text-align:center;
  vertical-align:middle;
  margin:0px;
  letter-spacing: normal;
	width:50%;
	position: relative;
    padding:0px;
font-size: 62.5%;
}

.feature_ .contents_inner_ #lp_ ul li p{font-size:14px; letter-spacing: 2px;}

.feature_ .contents_inner_ #lp_ ul li img, .feature_ .contents_inner_ #lp_ ul li a img{width:100% !important; display:block !important; margin:0 auto; }

.feature_ .contents_inner_ #lp_ ul li.width_{width:1040px;}

.feature_ .contents_inner_ #lp_ ul li a{color:#5B6670;}


.feature_ .contents_inner_ #lp_ .wd1100_{max-width:1100px !important;width:100%;  margin:0 auto !important;}



.feature_ .contents_inner_ #lp_ .pgt40_{padding-top:40px !important;}



.feature_ .contents_inner_ #lp_ .clearfix_::after {
   content: "" !important;
   display: block !important;
   clear: both !important;
}

/* -----------------------------------------------
フェードインの動きの大きさ設定
-------------------------------------------------- */

/* fadeUp */

.fadeInUpsmall{
animation-name:fadeUpAnime;
animation-duration:0.8s;
animation-fill-mode:forwards;
opacity:0;
}

/* -----------------------------------------------
フェードインの動きの大きさ設定
-------------------------------------------------- */
@keyframes fadeInUpsmall{
	0%{opacity:0;transform:translate3d(0,10%,0)}
	to{opacity:1;transform:none}
}
.fadeInUpsmall{	animation-name:fadeInUpsmall}

@keyframes fadeInDownsmall{
	0%{opacity:0;transform:translate3d(0,-10%,0)}
	to{opacity:1;transform:none}
}
.fadeInDownsmall{animation-name:fadeInDownsmall}

@keyframes fadeInRightsmall{
	0%{opacity:0;transform:translate3d(10%,0,0)}
	to{opacity:1;transform:none}
}
.fadeInRightsmall{animation-name:fadeInRightsmall}

@keyframes fadeInLeftsmall{
	0%{opacity:0;transform:translate3d(-10%,0,0)}
	to{	opacity:1;transform:none}
}
.fadeInLeftsmall{animation-name:fadeInLeftsmall}

/* -----------------------------------------------
/フェードインの動きの大きさ設定
-------------------------------------------------- */

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.fadeUpTrigger{
    opacity: 0;
}

.feature_ .contents_inner_ #lp_ p.link_item_{
  width:100%;
  margin:0px auto 0px;
  text-align: center;
	font-size:15px;
		font-family: Georgia, "Times New Roman", Times, "serif";

}


.feature_ .contents_inner_ #lp_ a {
  filter:alpha(opacity=100);
  -ms-filter:"alpha(opacity=100)";
  opacity:1;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  text-decoration: none;
  color:#404040;
  line-height:2.2;
	font-family: Georgia, "Times New Roman", Times, "serif";
       text-decoration: none;
   border-bottom: 1px solid #5b6670;
   padding-bottom: 2px;
}

.feature_ .contents_inner_ #lp_ .pricespan_ {
  width:100%;
  margin:0px auto 0px;
  text-align: center;
	font-size:10px;
}


.feature_ .contents_inner_ #lp_ .brandtitle_{
  width: 100%;
  margin: 50px auto 0;
    padding: 0.5rem 0rem;
    border-bottom: 2px solid #000;
    font-weight: bold;
    text-align: center;
}

.feature_ .contents_inner_ #lp_ .brandtitle_ p{
  font-family:YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
  letter-spacing: 0.2rem;
  font-size: 18px;
  font-weight: bold;
  padding: 6px;
/*    border-left: solid 10px #ffc06e;*/
}



/* 下からふわっと現れる個別アニメーション */
.fadeUp {
  -webkit-animation-name: fadeUpAnime;
          animation-name: fadeUpAnime;    /*アニメーションの名前*/
  -webkit-animation-duration: 1s;
          animation-duration: 1s;         /*アニメーションの実行時間*/
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;  /*アニメーション後、要素が表示されたままにする*/
}
@-webkit-keyframes fadeUpAnime {
  0% {
    opacity: 0;                   /*非表示*/
    -webkit-transform: translateY(100px);
            transform: translateY(100px); /*縦方向に100pxずらす*/
  }
  100% {
    opacity: 1;                   /*表示*/
    -webkit-transform: translateY(0);
            transform: translateY(0);     /*元の位置*/
  }
}
@keyframes fadeUpAnime {
  0% {
    opacity: 0;                   /*非表示*/
    -webkit-transform: translateY(20px);
            transform: translateY(20px); /*縦方向に100pxずらす*/
  }
  100% {
    opacity: 1;                   /*表示*/
    -webkit-transform: translateY(0);
            transform: translateY(0);     /*元の位置*/
  }
}
.fadeUpTrigger {
  opacity: 0;                     /*非表示*/
}


.feature_ .contents_inner_ #lp_ .hukidashi_{
    width: 50%;
    margin: 50px auto 0;
}

.feature_ .contents_inner_ #lp_ .dayimg_{
    width: 70%;
    margin: 40px auto 20px;
}

.feature_ .contents_inner_ #lp_ .phitem_{
    width: 70%;
    margin: 40px auto 20px;
}

.feature_ .contents_inner_ #lp_ .box_{
width: 100%!important;
margin: 120px auto 100px!important;
display: flex;
gap:2px;
}

.feature_ .contents_inner_ #lp_ .title_{
    width: 80%;
    margin: 40px auto 20px;
}


.feature_ .contents_inner_ #lp_ #content1_{
margin-top: 100px !important;
}

.feature_ .contents_inner_ #lp_ #content8_{
margin: 0 auto 60px !important;
}

.feature_ .contents_inner_ #lp_ .allitems_{
    width: 50%;
    margin: 0 auto 10px;
}

.feature_ .contents_inner_ #lp_ .phimg1_{
    width: 80%;
    margin: 0 auto;}

.feature_ .contents_inner_ #lp_ .absolute_link_a{
    position: absolute;
    top:8%;
    left: 31%;
    width: 200px;
    height: 100px;
    opacity: 0;
}

.feature_ .contents_inner_ #lp_ .absolute_link_b{
    position: absolute;
    top:22%;
    left: 13%;
    width: 200px;
    height: 100px;
/*    opacity: 0;*/
}

@media screen and (max-width: 600px) {

/* スマホ */



.feature_ .contents_inner_ #lp_ #tit_{
width: 100%;
margin: 20px auto 20px;
}

.feature_ .contents_inner_ #lp_ .box_{
margin: 40px auto 44px!important;
display: flex;
gap:2px;
}

.feature_ .contents_inner_ #lp_ .title_{
    width: 60%;
    margin: 50px auto 0px;
}


.feature_ .contents_inner_ #lp_ .brandtitle_{
  width: 100%;
  margin: 10px auto 0;
    padding: 0.5rem 0rem;
    border-bottom: 1px solid #000;
    text-align: center;
}


.feature_ .contents_inner_ #lp_ .dayimg_{
    width: 60%;
    margin: 30px auto 10px;
}

.feature_ .contents_inner_ #lp_ .phitem_{
    width: 40%;
    margin: 20px auto 20px;
}



.feature_ .contents_inner_ #lp_ ul li p
{font-size:9px; letter-spacing: 0px;}



.feature_ .contents_inner_ #lp_ #content1_{
margin-top: 50px !important;
}

.feature_ .contents_inner_ #lp_ #content8_{
margin: 0 auto 100px !important;
}


.feature_ .contents_inner_ #lp_ .allitems_{
    width: 65%;
    margin: 0 auto 10px;
}

.feature_ .contents_inner_ #lp_ .diana_{
    width: 55%;
    margin: 0 auto 10px;
}



.feature_ .contents_inner_ #lp_ .phimg1_{
    width: 100%;
    margin: 0 auto;
}

.feature_ .contents_inner_ #lp_ .hukidashi_{
    width: 90%;
    margin: 60px auto 0;
}




}