/* 蜈ｱ騾�
---------------------------------------------------- */
@media screen and (min-width:751px) { 
.purpose .contents{
width:1000px;
height:auto;
margin:0 auto;
padding:0 20px;
}
}

@media screen and (max-width:750px) { 
.purpose .cmn_unit_120{
margin:80px 0 0;
padding:0;
}
}

.swiper-wrapper{

}

.mySwiper2{


}

.swiper-slide{

}

.swiper-slide a{
    pointer-events: none;
}


/* 繝ｩ繝ｳ繧ｭ繝ｳ繧ｰ */
@media screen and (min-width:751px) { 
.item_ranking .inner{
display:flex;
justify-content:space-between;
width:960px;
margin:60px auto 0;
padding:0;
}
}

@media screen and (max-width:750px) { 
.item_ranking .inner{
display:flex;
overflow-x:auto;
overflow-scrolling: touch;
-webkit-overflow-scrolling:touch;
margin:40px auto 0;
padding:0 0 20px;
}
}

@media screen and (min-width:751px) { 
.item_ranking .inner .item{
width:192px;
text-align:center;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) { 
.item_ranking .inner .item{
width:160px;
text-align:center;
margin:0;
padding:0 10px;
}
}

@media screen and (min-width:751px) { 
.item_ranking .inner .item .item_rank{
height:40px;
font-size:116%;
line-height:1.5;
text-align:center;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) { 
.item_ranking .inner .item .item_rank{
height:40px;
font-size:116%;
line-height:1.5;
text-align:center;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) { 
.item_ranking .inner .item .item_img img{
width:160px;
height:160px;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) { 
.item_ranking .inner .item .item_img img{
width:140px;
height:140px;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) { 
.item_ranking .inner .item .item_title{
margin:0;
padding:10px 0 0;
}
}

@media screen and (max-width:750px) { 
.item_ranking .inner .item .item_title{
margin:0;
padding:10px 0 0;
}
}

@media screen and (min-width:751px) { 
.item_ranking .inner .item .item_title a{
font-size:116%;
line-height:1.5;
text-align:center;
color:#333;
text-decoration:none;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) { 
.item_ranking .inner .item .item_title a{
font-size:116%;
line-height:1.5;
text-align:center;
color:#333;
text-decoration:none;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) { 
.item_ranking .inner .item .item_title a:hover{
text-decoration:underline;
}
}

@media screen and (max-width:750px) { 
.item_ranking .inner .item .item_title a:hover{
text-decoration:underline;
}
}


/* 繧ｳ繝ｳ繝�Φ繝�ち繧､繝医Ν
---------------------------------------------------- */
@media screen and (min-width:751px) { 
.contents_title{
width:1000px;
margin:50px auto 0;
padding:0 20px;
}
}

@media screen and (max-width:750px) { 
.contents_title{
width: 100%;
margin:30px auto 0;
padding:0 20px;
}
}

@media screen and (min-width:751px) { 
.contents_title h1{
display:block;
min-height:28px;
font-size:189%;
font-weight:bold;
line-height:28px;
border-left: 4px solid #be0100;
margin:24px 0 0;
padding:0 0 0 16px;
}
}

@media screen and (max-width:750px) { 
.contents_title h1{
display:block;
min-height:28px;
font-size:182%;
font-weight:bold;
line-height:28px;
border-left: 4px solid #be0100;
margin:24px 0 0;
padding:0 0 0 16px;
}
}

@media screen and (min-width:751px) { 
.contents_title p{
font-size:108%;
line-height:1.8;
margin:22px 0 0;
padding:0;
}
}

@media screen and (max-width:750px) { 
.contents_title p{
font-size:108%;
line-height:1.8;
margin:22px 0 0;
padding:0;
}
}


/* 繧ｳ繝ｳ繝�Φ繝�し繝悶リ繝�
---------------------------------------------------- */


@media screen and (min-width:751px) {

}

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

}



@media screen and (min-width:751px) {
main .contents_sub_nav{
width:960px;
height:62px;
margin:0 auto;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav{
width:100%;
margin:0 auto;
padding:0;
}
}

@media screen and (min-width:751px) {
main .contents_sub_nav ul{
display:flex;
justify-content:center;
width:960px;
height:62px;
list-style:none;
text-align:center;
border-top: 1px solid #d9d9d9;
border-bottom: 1px solid #d9d9d9;
border-right: 1px solid #d9d9d9;
margin:70px 0 0 0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav ul{
display:flex;
flex-wrap: wrap;
width:100%;
list-style:none;
text-align:center;
border-top: 1px solid #d9d9d9;
margin:30px 0 0 0;
padding:0;
}
}

@media screen and (min-width:751px) {
main .contents_sub_nav ul li{
height:60px;
border-left: 1px solid #d9d9d9;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav ul li{
height:60px;
border-bottom: 1px solid #d9d9d9;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav ul li:nth-of-type(2n) {
border-left: 1px solid #d9d9d9;
}
}

@media screen and (min-width:751px) {
.purpose .contents_sub_nav ul li a{
display:block;
height:62px;
font-size:108%;
line-height:62px;
color:#333;
text-decoration:none;
vertical-align:middle;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav ul li a{
display:block;
height:62px;
font-size:100%;
line-height:62px;
color:#333;
text-decoration:none;
vertical-align:middle;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) {
main .contents_sub_nav ul li a:hover{
background-color:#f3f3f3;
}
}

@media screen and (max-width:750px) {
main .contents_sub_nav ul li a:hover{

}
}

@media screen and (min-width:751px) {
.purpose .contents_sub_nav ul.col2 li{
width:50%;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav ul.col2 li{
width:calc(100% - 50%);
}
}

@media screen and (min-width:751px) {
.purpose .contents_sub_nav ul.col4 li{
width:25%;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav ul.col4 li{
width:calc(100% - 50%);
}
}

@media screen and (min-width:751px) {
.purpose .contents_sub_nav ul.col5 li{
width:20%;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav ul.col5 li{
width:calc(100% - 50%);
}
}




@media screen and (min-width:751px) {
main .contents_sub_nav2{
width:960px;

margin:0 auto;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav2{
width:100%;
margin:0 auto;
padding:0;
}
}

@media screen and (min-width:751px) {
main .contents_sub_nav2 ul{
display:flex;
flex-wrap: wrap;
width:960px;

list-style:none;
text-align:center;
border-bottom: 1px solid #d9d9d9;
border-right: 1px solid #d9d9d9;
margin:70px 0 0 0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav2 ul{
display:flex;
flex-wrap: wrap;
width:100%;
list-style:none;
text-align:center;
border-bottom: 1px solid #d9d9d9;
margin:30px 0 0 0;
padding:0;
}
}

@media screen and (min-width:751px) {
main .contents_sub_nav2 ul li{
border-top: 1px solid #d9d9d9;
border-left: 1px solid #d9d9d9;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav2 ul li{
border-top: 1px solid #d9d9d9;
border-right: 1px solid #d9d9d9;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav2 ul li:nth-of-type(3n) {
border-right: none;
}
}

@media screen and (min-width:751px) {
.purpose .contents_sub_nav ul li.dc1{
display:none;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav2 ul li.dc{
display:none;
}
}

@media screen and (min-width:751px) {
.purpose .contents_sub_nav2 ul li a{
display:block;
height:62px;
font-size:108%;
line-height:62px;
color:#333;
text-decoration:none;
vertical-align:middle;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav2 ul li a{
display:block;
height:62px;
font-size:100%;
line-height:62px;
color:#333;
text-decoration:none;
vertical-align:middle;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) {
main .contents_sub_nav2 ul li a:hover{
background-color:#f3f3f3;
}
}

@media screen and (max-width:750px) {
main .contents_sub_nav2 ul li a:hover{

}
}

@media screen and (min-width:751px) {
.purpose .contents_sub_nav2 ul.col3 li{
width:20%;
}
}

@media screen and (max-width:750px) {
.purpose .contents_sub_nav2 ul.col3 li{
width:calc(100% / 3);
}
}




@media screen and (min-width:751px) {
main h2.contents_layer_title{
width:960px;
font-size:131%;
font-weight: bold;
line-height:1.6;
color:#333;
text-align:center;
margin:0 auto;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose h2.contents_layer_title{
width:100%;
font-size:131%;
font-weight: bold;
line-height:1.6;
color:#333;
text-align:center;
margin:0 auto;
padding:0;
}
}

@media screen and (min-width:751px) {
main h2.contents_layer_title {
position: relative;
text-align: center;
width:960px;
font-size:167%;
font-weight: bold;
line-height:1.6;
color:#333;
margin:0 auto;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose h2.contents_layer_title {
position: relative;
text-align: center;
width:100%;
font-size:131%;
font-weight: bold;
line-height:1.6;
color:#333;
margin:0 auto;
padding:0;
}
}

@media screen and (min-width:751px) {
main h2.contents_layer_title span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  background-color: #fff;
  text-align: left;
}
}

@media screen and (max-width:750px) {
.purpose h2.contents_layer_title span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  background-color: #fff;
  text-align: left;
}
}

@media screen and (min-width:751px) {
main h2.contents_layer_title::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #a3a3a3;
}
}

@media screen and (max-width:750px) {
.purpose h2.contents_layer_title::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #a3a3a3;
}
}

@media screen and (min-width:751px) {
main h3.summary{
width:960px;
font-size:167%;
font-weight: bold;
line-height:1.6;
color:#333;
text-align:center;
margin:60px auto 0;
padding:0;
}
}

@media screen and (max-width:750px) {
main h3.summary{
width:100%;
font-size:167%;
font-weight: bold;
line-height:1.6;
color:#333;
text-align:center;
margin:60px auto 0;
padding:0;
}
}

@media screen and (min-width:751px) {
main p.en_st{
width:960px;
font-size:100%;
line-height:1.6;
color:#333;
text-align:center;
margin:2px auto 0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose p.en_st{
width:100%;
font-size:100%;
line-height:1.6;
color:#333;
text-align:center;
margin:2px auto 0;
padding:0;
}
}



main p.sub_txt{
width:960px;
font-size:123.1%;
line-height:1.8;
color:#333;
text-align:center;
margin:20px auto 0;
padding:0;
}






.purpose .contents_img_title{
background:url(/novelty/img/bkgd.jpg);
background-position:top left;
background-repeat:no-repeat;
width:960px;
height: 310px;
margin: 0 auto;
padding:36px 0;
}

.purpose .contents_img_title .contents_main_img{
width:236px;
height:236px;
margin: 0 auto;
}

#feature_articles .purpose .contents_main_title{
width:960px;
font-size: 197%;
line-height: 1.6;
color:#333;
font-weight:bold;
text-align:center;
margin: 80px auto 0;
padding: 0 0 0 0;
}

.purpose .contents_sub_title{
width:960px;
font-size: 123.1%;
line-height: 1.8;
color:#333;
text-align:center;
margin: 20px auto 0;
padding: 0 0 0 0;
}

.purpose .feature_area{
display:flex;
justify-content: space-between;
width:960px;
margin:60px auto 0;
}

.purpose .feature_area .feature_box{
width:340px;
margin:0;
padding:0;
}

.purpose .feature_area .feature_box h3{
width:340px;
font-size: 153.9%;
line-height: 1.7;
text-align:center;
margin:30px 0 0;
}

.purpose .feature_area .feature_box p{
width:340px;
font-size: 123.1%;
line-height: 1.7;
margin:10px 0 0;
}


/* 繝弱�繝ｫ繝�ぅ繧ｰ繝�ぜ荳€隕ｧ
---------------------------------------------------- */
/* 繝弱�繝ｫ繝�ぅ繧ｰ繝�ぜ荳€隕ｧ */
@media screen and (min-width:751px) { 
#feature_articles .purpose .contents_main_img{
background:url(/product/novelty/img/main_img_bk.jpg);
background-position:center top;
background-repeat:no-repeat;
min-width:1000px;
width:100%;
height:368px;
margin:0 auto;
padding:0;
}
}

@media screen and (max-width:750px) { 
#feature_articles .purpose .contents_main_img{
background:url(/product/novelty/img/main_img_bk.jpg);
background-position:center top;
background-repeat:no-repeat;
width:100%;
height:368px;
margin:0 auto;
padding:0;
}
}

@media screen and (min-width:751px) { 
#feature_articles .contents_main_img h1{
width:380px;
height:auto;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) { 
#feature_articles .contents_main_img h1{
width:90%;
height:auto;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) { 
#feature_articles .contents_main_img span{
display: inline;
font-size: 0;
margin-bottom: 0;
}
}

@media screen and (max-width:750px) { 
#feature_articles .contents_main_img span{
display: inline;
font-size: 0;
margin-bottom: 0;
}
}

@media screen and (min-width:751px) {
.purpose .item_area{
display:flex;
flex-wrap: wrap;
width:960px;
margin:0px auto 0;
}
}

@media screen and (max-width:750px) {
.purpose .item_area{
display:flex;
flex-wrap: wrap;
width:96%;
margin:0px auto 0;
}
}

@media screen and (min-width:751px) {
.purpose .item_area .item{
display: flex;
flex-direction: column;
width:240px;
margin:50px 0 0;
padding:0 10px;
}
}

@media screen and (max-width:750px) {
.purpose .item_area .item{
display: flex;
flex-direction: column;
width:50%;
margin:34px 0 0;
padding:0 10px;
}
}

@media screen and (min-width:751px) {
.purpose .item_area .item .item_img{
width:100%;
text-align:center;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .item_area .item .item_img{
width:100%;
text-align:center;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) {
.purpose .item_area .item .item_img img{
width:200px;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .item_area .item .item_img img{
width:88%;
margin:0 auto;
padding:0;
}
}

@media screen and (min-width:751px) {
.purpose .item .item_title{
margin:0;
padding:4px 0 0;
}
}

@media screen and (max-width:750px) {
.purpose .item .item_title{
margin:0;
padding:4px 0 0;
}
}

@media screen and (min-width:751px) {
.purpose .item .item_title a{
font-size:116%;
line-height:1.5;
color:#333;
text-decoration:none;
margin:0;
padding:0;
}
}

@media screen and (max-width:750px) {
.purpose .item .item_title a{
font-size: 108%;
line-height:1.5;
color:#333;
text-decoration:none;
margin:0;
padding:0;
}
}

@media screen and (min-width:751px) {
.purpose .item .item_title a:hover{
text-decoration:underline;
}
}

@media screen and (max-width:750px) {
.purpose .item .item_title a:hover{
text-decoration:none;
}
}

@media screen and (min-width:751px) {
.purpose .item .item_txt{
font-size:93%;
line-height:1.5;
margin:0;
padding:4px 0 0;
}
}

@media screen and (max-width:750px) {
.purpose .item .item_txt{
font-size:93%;
line-height:1.5;
margin:0;
padding:4px 0 0;
}
}

@media screen and (min-width:751px) {
.purpose .item .item_price{
font-size:138.5%;
font-weight:bold;
line-height:1.5;

color:#333;
margin:0;
padding:4px 0 0;
}
}

@media screen and (max-width:750px) {
.purpose .item .item_price{
font-size:123.1%;
font-weight:bold;
line-height:1.5;
color:#333;
margin:0;
padding:4px 0 0;
}
}

@media screen and (min-width:751px) {
.purpose .item .item_price span{
font-size:60%;
}
}

@media screen and (max-width:750px) {
.purpose .item .item_price span{
font-size:60%;
}
}














@media screen and (min-width:751px) {
.purpose .item_area .item p.btn a{
display:block;
background-color:#fff;
border-radius: 5%;
-moz-border-radius: 5%;
-webkit-border-radius: 5%;
width:120px;
height:34px;
max-height: 34px;
font-size:100%;
line-height:34px;
color:#333;
text-align:center;
text-decoration:none;
border: 1px solid #b5b5b5;
margin:10px auto 0;
}
}

@media screen and (max-width:750px) {
.purpose .item_area .item p.btn a{
display:block;
background-color:#fff;
border-radius: 5%;
-moz-border-radius: 5%;
-webkit-border-radius: 5%;
width:120px;
height:34px;
max-height: 34px;
font-size:100%;
line-height:34px;
color:#333;
text-align:center;
text-decoration:none;
border: 1px solid #b5b5b5;
margin:10px auto 0;
}
}

@media screen and (min-width:751px) {
.purpose .item_area .item p.btn a:hover{
background-color:#494949;
color:#fff;
border: 1px solid #494949;
}
}

.item_data {
position: relative;
cursor: pointer;
}

.item_data:hover{
text-decoration:underline;
}

/* Tooltip */
.copied::after {
  position: absolute;
  display: inline-block;
  background: #555;
  content: '繧ｳ繝斐�縺励∪縺励◆';
  width: 90px;
  font-size: 93%;
line-height:1;
  color: #fff;
text-align: center;
  border-radius: .4rem;
  padding: 8px 4px 8px 4px;
top:-40px;
left:40px;
-webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
-webkit-animation: fade-tooltip .5s 1s 1 forwards;
        animation: fade-tooltip .5s 1s 1 forwards;
}

.copied::before {
position: absolute;
display: inline-block;
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 10px 5px 0 5px;
border-color: #555 transparent transparent transparent;
top:-14px;
left:40px;
-webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
-webkit-animation: fade-tooltip .5s 1s 1 forwards;
        animation: fade-tooltip .5s 1s 1 forwards;
}

/* Animation */
@-webkit-keyframes fade-tooltip {
  to {
    opacity: 0;
  }
}
@keyframes fade-tooltip {
  to {
    opacity: 0;
  }
}