@import url("https://use.typekit.net/jtd7wiw.css");

$pink:#ffe5e5;
$blue:#b4e7ff;

$font3: 'paganini-open', sans-serif;
$font2: 'mr-eaves-modern', sans-serif;;
$font1:'gioviale', sans-serif;
$color:#e60012;
$red: #7e1418;
$gold:#b38853;


@mixin fontlight{
font-family: mr-eaves-sans, sans-serif;
font-weight: 200;
font-style: normal;
}

@mixin flex{
	display: inline-flex;
	display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flex;
    display: -o-inline-flex;
	box-sizing: border-box;
}

@mixin flex2{
	display: flex;
	display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
	box-sizing: border-box;
}

@mixin giji{
    content: "";
    position: absolute;
}

@mixin font1{
    font-family: 'gioviale', sans-serif;
    line-height: 1.2em;
}

li{list-style: none;}



body{
	background: url("../img/1912giftforher_bg.gif");
	letter-spacing: 0.07em;
	margin: 0;
	padding: 0;
    scroll-behavior: smooth;
}

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

   /*---ナビメニュー---*/

.dropmenu{
  *zoom: 1;
  list-style-type: none;
  width: 80%;
  margin: 0 10%;
  padding: 0;
	display: inline-block;
    z-index: 55;
    position: relative;
}
.dropmenu:before, .dropmenu:after{
  content: "";
  display: table;
}
.dropmenu:after{
  clear: both;
}
.dropmenu li{
  position: relative;
  width: 32%;
  float: left;
  margin: 0 10px 0 0;
  padding: 0;
  text-align: center;
box-sizing: border-box;
/*border: 1px solid #6E6E6E;*/
}
.dropmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #FFF;
  color: #000;
   font-weight: 500;
  line-height: 1;
  text-decoration: none;
}
.dropmenu li ul{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
.dropmenu li ul li{
  width: 100%;
	border: none;
    
}
.dropmenu li ul li a{
  padding: 8px 10px 8px 0;
    box-sizing: border-box;
  text-align: left;
}
.dropmenu li:hover > a{
  background:#FDD6D7;
}
/*.dropmenu li a:hover{
  background:#73d0f2;
}*/

#fade-in2 li ul{
  opacity: 0;
  top: 50%;
  visibility: hidden;
  transition: .5s;
    
}
#fade-in2 li:hover ul{
  top: 100%;
  visibility: visible;
  opacity: 1;
}

button{
	padding: 8px;
  border-top: 1px solid #dddddd !important;
  background: #F89294;
    margin: 0;
  text-align: center;
	font-size: 18px;
	width:100%;
    color: #fff;
    box-sizing: border-box;
	cursor: pointer;
	box-shadow: none;
    font-weight: 400;
	border-bottom: none;
	border-left: none;
	border-right: none;
	}
button:hover{
		background-color:#D92E31;
	}

/*button.active{
  background:#8E7039;
	
}*/

button:focus{
  outline: 0 none;
}

button + label{
  margin-left: 1em;
}
    button.main{padding: 15px 8px;}
	button.base{
		font-style: $font1;
		font-size: 18px;
		text-align: center;
        border: 1px solid #a00000;
		/*border-top: none;*/
		background: #ffffff !important;
        color:#000;
	}
	button.base:hover{
		background: #D92E31;
	}
	button.base1{
        border-top: 1px solid #dddddd important;
		font-style: $font1;
		font-size: 18px;
		text-align: center;
		border-top: none;
        color: #fff;
		background:#2F823E;
         margin: 0;
	}
	button.base1:hover{
		background:#065CAC;
	}
	button.base1.active{
  /*background:#FDD6D7;*/
        font-size: 18px;
	}
	  
    
    
.wrapper{
	width: 1200px;
	margin: 0 auto;
	padding: 0;
	text-align: center;
    box-sizing: border-box;
    
}

    header{
        position: relative;
        text-align: center;
        margin: 20px auto 70px;
        width: 1200px;
    }
    /*header:after{
        @include giji;
        background: url("../img/1912giftforher_header_star.png")no-repeat;
        width: 1006px;
        height: 437px;
        top:-30px;
        left:100px;
    }*/
	

 .ranking{
 @include flex;
 margin: 20px auto;
 justify-content: space-between;
 width: 1000px;
 li{width: 30%;
 position: relative;
 dl{margin-bottom: 15px; dt{font-size: 1rem; font-weight: 600; margin: 5px auto;}
 dd{font-size: 12px;}}}
 
  li:nth-child(1):after{
position: absolute;
content: "1";
 top:-80px;
 left:-0;
 width: 10px;
 height: 10px;
 font-size: 4rem;
 font-family: $font1;
 color: #8A6700;
 }
 
 li:nth-child(2):after{
position: absolute;
content: "2";
 top:-80px;
 left:-0;
 width: 10px;
 height: 10px;
 font-size: 4rem;
 font-family: $font1;
 color: #8A6700;
 }

  li:nth-child(3):after{
position: absolute;
content: "3";
 top:-80px;
 left:-0;
 width: 10px;
 height: 10px;
 font-size: 4rem;
 font-family: $font1;
 color: #8A6700;
 }

 }
    
    .header_lady{
        @include giji;
        width: 257px;
        height: 365px;
        bottom:-3px;
        left:-80px;
    }

    .bigmenu{
        position: relative;
        margin: 30px 0;
        width: 100%;
        background: #ffffff;
        padding: 30px 0;
        text-align: center;
    }
    
    .bigmenu:after{
        @include giji;
        background: url("../img/1912giftforme_menu_after.png")no-repeat;
        width: 310px;
        height: 172px;
        top:-10px;
        right: 15%;
    }
     .bigmenu:before{
        @include giji;
        background: url("../img/1912giftforme_menu_after.png")no-repeat;
        width: 310px;
        height: 172px;
        top:-10px;
        left: 15%;
        transform: scale(-1, 1);
    }
   
/*アイテムナビ*/

	.s01{
		padding: 30px 0;
	}
	.s02{
		padding: 30px 0;
	}
	.nav_main{
		margin-top: 10px;
		@include giji;
		width: 900px;
		justify-content: space-between;
		li{width: 300px;
			
			a{color: #fff;
			font-size: 1.2rem;
			font-weight: 600;}
		}
		li +li{
    border-left: 1px solid #fff;
    padding: 0 10px 0 10px;
	
}
		li:hover{
			background: #fbe1e4;
		}
	}
	
	.bg_shima{
		border-top:5px solid #7E0103;
		border-bottom:5px solid #7E0103;
		-webkit-background-size: 100px 100px;
-moz-background-size: 100px 100px;
background-size: 100px 100px;
background-color: #f6f2e2;
background-image: -webkit-gradient(linear, 0 0, 100% 0, color-stop(.5, #fffdf5), color-stop(.5, transparent), to(transparent));
background-image: -moz-linear-gradient(left, #fffdf5 50%, transparent 50%, transparent);
background-image: -o-linear-gradient(left, #fffdf5 50%, transparent 50%, transparent);
background-image: linear-gradient(left, #fffdf5 50%, transparent 50%, transparent);
	}
	
	.white_bg{
	background: #fff;
	width: 300px;
	display: inline-block;
}
	.nav_title{
		display: inline-block;
		width:300px;
		margin: 15px 0;
		position: relative;
		font-size: 1.8rem;
		font-weight: 600;
		color:#cc1b21;
		line-height: 1;
		.small{color:#a9a9a9;
		font-size: 14px;}
	}
	.nav_title:before{
		position: absolute;
		content: "";
		width: 100%;
		border-bottom: 1px solid $gold;
		border-top: 2px solid $gold;
		height: 1px;
		left: 0;
		top:-13px;
	}
	.nav_title:after{
		position: absolute;
		content: "";
		width: 100%;
		border-bottom: 2px solid $gold;
		border-top: 1px solid $gold;
		height: 1px;
		left: 0;
		bottom: -13px;
	}
	
	.nav_brand{
		margin: 30px auto;
		display: inline-flex;
		display: -webkit-inline-flex;
    	display: -moz-inline-flex;
		display: -ms-inline-flex;
		display: -o-inline-flex;
		width: 1150px;
		justify-content: space-between;
		li{
			margin: 20px auto;
		width:265px;
		height: 200px;
		position: relative;
		.txtbg{
			position: absolute;
			content: "";
			background: $red;
			padding: 3px;
			width: 150px;
			font-size: 1.5rem;
			font-family: $font2;
			color:#fff;
			left:53px;
			bottom:-5px;
			line-height: 1.1;
			.small{font-size: 12px;
				
			}
		}
		}
		li:last-child{margin-bottom: 30px;}
	}
	
	.line{
		margin: 50px 0;
		background: url(../img/line.png) repeat-x;
		height: 11px;
		width: 1150px;
		display: inline-block;
	}
	
    
    
    h1{
       font-size: 16px;
        font-weight: 600;
        color: #A40003;
    }
    
    h2{font-family: $font2;
        font-size: 2rem;
        color: #ED0E8B;
        p{font-size: 12px;}
    margin: 0;
    padding: 0;}
    
    
    h3{ position: relative;
        display: inline-block;
        font-size: 2rem;
        width: 100%;
        font-family: $font2;
        margin: 10px 0 30px;
        color: #834e00;
        p{font-size: 14px;
       }
        span{font-size: 1rem;}
    }
    h3:after{
        @include giji;
        width: 90%;
        height: 10px;
        background: url("../img/1912giftforme_18.png")repeat-x;
        left: 5%;
        top:65px;
    }
    
    h4{font-size: 3rem;
    font-family: $font1;
    color: #AD0002;
        position: relative;
        margin: 0 0 -30px;
        padding: 0;
    }
    h4:after{
        @include giji;
        width: 90%;
        height: 2px;
        left:5%;
        top:100px;
        border-bottom: 1px solid #776800;
    }
    
    .ladymen_tab{
        
        @include flex2;
        width: 530px;
        margin: 0 auto;
        justify-content: space-between;
        li{
            margin-top:20px;
            width: 250px;
            color: #ffffff;
            font-size: 2rem;
            font-family: $font3;
            p{font-size:  14px;
                color: #fff;
            margin-bottom: -5px;}}
        li:a{display: block;
        color: #fff !important;}
        .men_bg{background: #00561f;}
        .men_bg a{color: #fff;
        display: block;}
        .lady_bg{background: #a40000;}
        .lady_bg a{color: #fff;
        display: block;}
    }
    
    .lady_box{
        display: inline-block;
        width: 1200px;
        box-sizing: border-box;
        border: 10px solid #a40000;
         padding: 20px;
        .lady_menu{
            @include flex;   
        justify-content: space-between;
            li{
               color: #fff;
                padding: 10px 0;
               font-size: 16px;
            background: #F89294;}
        }
    }
    
    .mencolor{color:#00561f;}
    .mencolor_bg{background:#00561f;}
    .men_box{
        display: inline-block;
        width: 1200px;
        box-sizing: border-box;
        border: 10px solid #00561f;
         padding: 20px;
        
        .men_menu{
            @include flex;   
        justify-content: space-between;
            li{
               color: #fff;
                padding: 10px 0;
               font-size: 16px;
            background: #F89294;}
        }
    }
    
    section{
            width: 1200px;
            margin: 80px auto;
            box-sizing: border-box;
            background: #f6f1ed;
        	text-align: center;
            padding: 3px;}
        .outline{
            position: relative;
            border: 1px solid #b7aa00;
            padding-bottom: 30px;
    }
    
    .outline:after{
        position: absolute;
        content: "";
        background: url("../img/1912giftforme_contents_before.png")no-repeat;
        width: 148px;
        height: 135px;
        top:-50px;
        left: -15px;
    }
    .outline:before{
        position: absolute;
        content: "";
        background: url("../img/1912giftforme_contents_after.png")no-repeat;
        width: 148px;
        height: 135px;
        top:-50px;
        right: -15px;
    }
    
    
  .pickup{
        margin: 20px 0;
        position: relative;
        @include flex;
        width: 1100px;
        z-index: 555;
        justify-content: space-between;
        li{
            position: relative;
            width: 520px;
            background:#ffffff;
            padding: 5px 0 25px 0;
            box-sizing: border-box;
            .sub{font-size: 11px;}
            .title{
                @include font1;
                letter-spacing: 0.1em;
                font-size: 2.8rem;
                font-weight: 600;
            }
           
            .title2{
                position: relative;
                margin: 10px 0 0;
               font-family: $font3;
                letter-spacing: 0.1em;
                font-size: 2rem;
                font-weight: 400;
                span{background: #fff;
                position: relative;
                    padding: 0 5px;
                z-index: 55;}
            }
            .title2:after{
                @include giji;
                top:24px;
                left:5%;
                width: 90%;
                border-bottom: 1px #000 solid;
                z-index: 0;
            }
            
            .btn{
                background: #b6483d;
                color: #fff;
                display: inline;
                font-size: 14px;
                padding: 5px;
                
            }
            .btn a{color:#fff !important;}
            .btn:hover{background: #d0aa93;}
              .icon{
                @include giji;
                width: 208px;
                height: 114px;
                top:-25px;
                left:-70px;
            }
           }
       
    }
	.btn{
                background: #b6483d;
                color: #fff;
                display: inline;
                font-size: 14px;
                padding: 5px;
                
            }
            .btn a{color:#fff !important;}
            .btn:hover{background: #d0aa93;}
              .icon{
                @include giji;
                width: 208px;
                height: 114px;
                top:-25px;
                left:-70px;
            }
    .blueline{ border: 5px solid #ca987c;}
        .pickup_cont{
        width: 100%;
            @include flex;
            justify-content: space-between;
        li{text-align: left;
            position: relative;
            .brand{
                font-family: $font2;
                font-size: 1.5rem;
                font-weight: 600;
                letter-spacing: 0.1em;
            }
            .brand2{
                
                font-size: 1rem;
                
                letter-spacing: 0.1em;
            }
            
            .red{color: $color;}
            p{font-size: 12px;}
            img{width: 230px;}
            .btn{
                position: absolute;
                background: #b6483d;
                color: #fff;
                display: inline;
                font-size: 14px;
                padding: 5px;
                bottom: 10px;
                right: 10px;
            }
            .btn a{color:#fff !important;}
            .btn:hover{background: #d0aa93;}
        }
        }
    .pickup_3items{
        margin-bottom: 15px;
        @include flex;
        justify-content: space-between;
        width: 100%;
        li{width: 33%;
            .brand{font-family: $font2;
                font-size: 16px;
                font-weight: 600;
                letter-spacing: 0.1em;}
            img{width: 145px;}}
        
    }
    
    .liveitem{
	display: inline-block;
	width: 100%;
	margin: 20px 30px;
}


	.price_menu{
	@include flex;
	margin-top: 30px;
	justify-content: space-between;
	width: 1100px;
	li{width: 19%;
	font-size: 16px;
	color: #fff;
	padding: 10px 0;
	background: #7e1418;
	transition: 1.2s;
	a{color: #fff;}

	}li:hover{background: #FF9294;}}
	
	
.button {
    margin-top: 30px;
  display: inline-block;
  text-align: center;
  text-decoration: none;
    font-family: $font2;
  outline: none;
	padding: 10px 30px;
	font-size: 2rem;
}
.button::before,
.button::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button,
.button::before,
.button::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.button {
  background-color:#b72c4b;
  border: 2px solid #b72c4b;
  color: #fff !important;
}
.button:hover {
  background-color: #fff;
  border-color: #b72c4b;
  color: #b72c4b !important;
}

    
}


/*-------------SP用-------------*/
@media screen and (max-width:640px) {

/*---ナビメニュー---*/

.dropmenu{
  *zoom: 1;
  list-style-type: none;
  width: 100%;
  /*margin: 0 10%;*/
  padding: 0;
	display: inline-block;
}
.dropmenu:before, .dropmenu:after{
  content: "";
  display: table;
}
.dropmenu:after{
  clear: both;
}
.dropmenu li{
  position: relative;
  width: 100%;
  float: left;
  margin: 0 10px 0 0;
  padding: 0;
  text-align: center;
box-sizing: border-box;
/*border: 1px solid #6E6E6E;*/
}
.dropmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #FFF;
  color: #000;
   font-weight: 500;
  line-height: 1;
  text-decoration: none;
}
.dropmenu li ul{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
.dropmenu li ul li{
  width: 100%;
	border: none;
}
.dropmenu li ul li a{
  padding: 8px 10px 8px 0;
    box-sizing: border-box;
  text-align: left;
}
.dropmenu li:hover > a{
  background:#FDD6D7;
}
/*.dropmenu li a:hover{
  background:#73d0f2;
}*/

#fade-in2 li ul{
  opacity: 0;
  top: 50%;
  visibility: hidden;
  transition: .5s;
    
}
#fade-in2 li:hover ul{
  top: 100%;
  visibility: visible;
  opacity: 1;
}

button{
	padding: 8px;
  border-top: 1px solid #dddddd;
  background: #FDABAC;
    margin: 0;
  text-align: center;
	font-size: 16px;
	width:100%;
    color: #fff;
    box-sizing: border-box;
	cursor: pointer;
	box-shadow: none;
    font-weight: 400;
	border-bottom: none;
	border-left: none;
	border-right: none;
	}
button:hover{
		background-color:#D92E31;
	}

/*button.active{
  background:#8E7039;
	
}*/

button:focus{
  outline: 0 none;
}

button + label{
  margin-left: 1em;
}
	
	button.base{
		font-style: $font1;
		font-size: 18px;
		text-align: center;
        border: 1px solid #a00000;
		/*border-top: none;*/
		background: #ffffff !important;
        color:#000;
	}
	button.base:hover{
		background: #D92E31;
	}
	button.base1{
		font-style: $font1;
		font-size: 18px;
		text-align: center;
		border-top: none;
        color: #fff;
		background: #BB0003;
	}
	button.base1:hover{
		background: #CF4345;
	}
	button.base1.active{
  /*background:#FDD6D7;*/
        font-size: 18px;
	}
	  
    
.wrapper{
	width: 1200px;
	margin: 0 auto;
	padding: 0;
	text-align: center;
    box-sizing: border-box;
    
}

    header{
        position: relative;
        text-align: center;
        margin: 20px auto 70px;
        width: 100%;
        img{margin: 40px 0 -30px;}
    }
    header:after{
        display: none;
    }
    .header_men{
        @include giji;
        width: 250px;
        height: 322px;
        bottom:10px;
        left:-80px;
    }
    
    .header_lady{
        @include giji;
        width: 257px;
        height: 365px;
        bottom:-20px;
        right:-80px;
    }

    .bigmenu{
        overflow: hidden;
        position: relative;
        margin: 10px 0;
        width: 100%;
        background: #ffffff;
        padding: 10px;
        box-sizing: border-box;
        text-align: center;
    }
    
    .bigmenu:after{
        @include giji;
        background: url("../img/1912giftforme_menu_after.png")no-repeat;
        width: 150px;
        height: 172px;
        background-size: contain;
        top:-20px;
        right: -15px;
    }
     .bigmenu:before{
        @include giji;
        background: url("../img/1912giftforme_menu_after.png")no-repeat;
        width: 150px;
        height: 172px;
         background-size: contain;
        top:-20px;
        left: -15px;
        transform: scale(-1, 1);
    }
    
    /*アイテムナビ*/
    	.s01{
		padding: 50px 0;
	}
	.s02{
		padding: 30px 0;
	}
	.nav_main{
		margin-top: 10px;
		@include giji;
		justify-content: space-around;
		width: 100%;
		li{width: 30%;
			
			a{color: #fff;
				letter-spacing: 0.7;
			font-size: 11px;
			font-weight: 600;}
		}
		li +li{
    border-left: 1px solid #fff;
    padding: 0;
	
}
		li:hover{
			background: #fbe1e4;
		}
	}
	
	.bg_shima{
		border-top:5px solid #7E0103;
		border-bottom:5px solid #7E0103;
		-webkit-background-size: 100px 100px;
-moz-background-size: 100px 100px;
background-size: 100px 100px;
background-color: #f6f2e2;
background-image: -webkit-gradient(linear, 0 0, 100% 0, color-stop(.5, #fffdf5), color-stop(.5, transparent), to(transparent));
background-image: -moz-linear-gradient(left, #fffdf5 50%, transparent 50%, transparent);
background-image: -o-linear-gradient(left, #fffdf5 50%, transparent 50%, transparent);
background-image: linear-gradient(left, #fffdf5 50%, transparent 50%, transparent);
	}
	
.white_bg{
	background: #fff;
	width: 80%;
	display: inline-block;
}
	.nav_title{
		display: inline-block;
		width:100%;
		margin: 15px 0;
		position: relative;
		font-size: 1.4rem;
		font-weight: 600;
		color:#cc1b21;
		line-height: 1;
		.small{color:#a9a9a9;
		font-size: 14px;}
	}
	.nav_title:before{
		position: absolute;
		content: "";
		width: 100%;
		border-bottom: 1px solid $gold;
		border-top: 2px solid $gold;
		height: 1px;
		left: 0;
		top:-13px;
	}
	.nav_title:after{
		position: absolute;
		content: "";
		width: 100%;
		border-bottom: 2px solid $gold;
		border-top: 1px solid $gold;
		height: 1px;
		left: 0;
		bottom: -13px;
	}
	
	.nav_brand{
		margin: 30px 0;
		display: inline-flex;
		display: -webkit-inline-flex;
    	display: -moz-inline-flex;
		display: -ms-inline-flex;
		display: -o-inline-flex;
		width: 98%;
		flex-wrap: wrap;
		justify-content: space-between;
		li{
		margin: 20px auto;
		width:48%;
		position: relative;
		.txtbg{
			position: absolute;
			content: "";
			background: $red;
			padding: 3px;
			width: 70%;
			font-size: 16px;
			font-family: $font1;
			color:#fff;
			left:15%;
			bottom:-5%;
			line-height: 1.1;
			.small{font-size: 12px;
				
			}
		}
		}
		li:last-child{margin-bottom: 30px;}
	}


 .ranking{
 @include flex;
 margin: 20px auto;
 justify-content: space-around;
 width: 100%;
 flex-wrap: wrap;
 li{width: 45%;
 margin-top: 20px;
 position: relative;
 dl{margin-bottom: 15px; dt{font-size: 1rem; font-weight: 600; margin: 5px auto;}
 dd{font-size: 12px;}}}
 
  li:nth-child(1):after{
position: absolute;
content: "1";
 top:-80px;
 left:-0;
 width: 10px;
 height: 10px;
 font-size: 4rem;
 font-family: $font1;
 color: #8A6700;
 }
 
 li:nth-child(2):after{
position: absolute;
content: "2";
 top:-80px;
 left:-0;
 width: 10px;
 height: 10px;
 font-size: 4rem;
 font-family: $font1;
 color: #8A6700;
 }

  li:nth-child(3):after{
position: absolute;
content: "3";
 top:-80px;
 left:-0;
 width: 10px;
 height: 10px;
 font-size: 4rem;
 font-family: $font1;
 color: #8A6700;
 }

 }
	
	.price_menu{
	@include flex;
	margin-top: 30px;
	justify-content: space-between;
	width: 90%;;
	flex-wrap: wrap;
	li{width: 100%;
	font-size: 16px;
	color: #fff;
	padding: 10px 0;
	margin: 5px 0 0;
	background: #7e1418;
	transition: 1.2s;
	a{color: #fff;}
	}}
	
	.line{
		margin: 50px 0;
		background: url(../img/line.png) repeat-x;
		height: 11px;
		width: 95%;
		display: inline-block;
	}
	
    
    
    /*///navi///*/
    .controls{
    width: 100%;
    box-sizing: border-box;
    
        margin: 0;
    text-align: center;
    }
.cp_actab {
	position: relative;
	overflow: hidden;
	width: 80%;
	margin: 0 10%;
	color: #ffffff;
}
.cp_actab input {
	position: absolute;
	z-index: -1;
	opacity: 0;
}
.cp_actab label {
	font-weight: bold;
	line-height: 3;
	position: relative;
	display: block;
	padding: 0 0 0 0;
	cursor: pointer;
	margin: 0 0 1px 0;
	font-family: $font1;
	font-size: 16px;
	background: #FD8183;
}

    .cp_actab a{color:#fff !important;}
    
.cp_actab .cp_actab-content {
	overflow: hidden;
	max-height: 0;
	-webkit-transition: max-height 0.80s;
	transition: max-height 0.80s;
	color: #333333;
	
}.menbg2{background: #40B751 !important;}
    .menbg{background: #1A8330 !important;}
    .menbg a{color:#ffffff;}
    .mencolor{color: #1B80C0 !important;}
    .xmascolor{background: #C00003 !important;}
/* :checked */
.cp_actab input:checked ~ .cp_actab-content {
	max-height: 12.7em;
}
/* Icon */
.cp_actab label::after {
	line-height: 3;
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	width: 3em;
	height: 3em;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
	text-align: center;
}
.cp_actab input[type=checkbox] + label::after {
	content: "▼";
    top: 0;
	right: 0;
	font-size: 16px;
}
.cp_actab input[type=checkbox]:checked + label::after {
	transform: rotate(180deg);
}
   
    h1{
        position: relative;
       font-size: 14px;
        font-weight: 600;
        color: #A40003;
        z-index: 55;
    }
    
    h2{font-family: $font2;
        font-size: 2rem;
        color: #ED0E8B;
        p{font-size: 12px;}
    margin: 0;
    padding: 0;}
    
    
    h3{ position: relative;
        display: inline-block;
        font-size: 2rem;
        width: 100%;
        font-family: $font2;
        margin: 10px 0 30px;
        color: #834e00;
        p{font-size: 14px;
       }
        span{font-size: 16px;}
    }
    h3:after{
        @include giji;
        width: 90%;
        height: 10px;
        background: url("../img/1912giftforme_18.png")repeat-x;
        left: 5%;
        top:65px;
    }
    
    h4{font-size: 2rem;
    font-family: $font1;
    color: #AD0002;
        position: relative;
        margin: 0 0 -30px;
        padding: 0;
    }
    h4:after{
        @include giji;
        width: 90%;
        height: 2px;
        left:5%;
        top:100px;
        border-bottom: 1px solid #776800;
    }
    
    .ladymen_tab{
        @include flex;
        width: 90%;
        justify-content: space-between;
        li{
            
            margin-top:20px;
            width: 48%;
            color: #ffffff;
            font-size: 1.5rem;
            font-family: $font3;
            p{font-size:  14px;
                color: #fff;
            margin-bottom: -5px;}}
        li:a{display: block;
        color: #fff !important;}
        .men_bg{background: #00561f;}
        .men_bg a{color: #fff;
        display: block;}
        .lady_bg{background: #a40000;}
    }
    
    .lady_box{
        display: inline-block;
        width: 95%;
        box-sizing: border-box;
        border: 10px solid #a40000;
         padding: 20px;
        .lady_menu{
            @include flex;
            
        justify-content: space-between;
            li{
               color: #fff;
                padding: 10px 0;
               font-size: 16px;
            background: #F89294;}
        }
    }
    
    .men_box{
        width: 95%;
        box-sizing: border-box;
        border: 10px solid #00561f;
         padding: 20px;
    }
    
    section{
            width: 98%;
            margin: 80px auto;
            box-sizing: border-box;
            background: #f6f1ed;
        text-align: center;
            padding: 3px;}
        .outline{
            position: relative;
            border: 1px solid #b7aa00;
            padding-bottom: 30px;
    }
    
    .outline:after{
        position: absolute;
        content: "";
        background: url("../img/1912giftforme_contents_before.png")no-repeat;
        width: 100px;
        height: 135px;
        top:-30px;
        left: -15px;
        background-size: contain;
    }
    .outline:before{
        position: absolute;
        content: "";
        background: url("../img/1912giftforme_contents_after.png")no-repeat;
        width: 100px;
        height: 135px;
        top:-30px;
        right: -8px;
        background-size: contain;
    }
    
    
    /*////pickup contents////*/    
    
    .pickup{
        
        margin: 20px 0; 
        position: relative;
        @include flex;
        width: 98%;
        z-index: 555;
        justify-content: space-between;
        flex-wrap: wrap;
        li{width: 100%;
            background: #fff;
            position: relative;
            margin-top: 10px;
            padding: 5px 0 25px 0;
            box-sizing: border-box;
            .sub{font-size: 11px;}
            .title{
                @include font1;
                letter-spacing: 0.1em;
                font-size: 2.8rem;
                font-weight: 600;
            }
            .title2{
                position: relative;
                margin: 10px 0 0;
               font-family: $font3;
                letter-spacing: 0.1em;
                font-size: 2rem;
                font-weight: 400;
                span{background: #fff;
                position: relative;
                z-index: 55;}
            }
            .title2:after{
                @include giji;
                top:24px;
                left:5%;
                width: 90%;
                border-bottom: 1px #000 solid;
                z-index: 0;
            }
             
            .btn{
                background: #b34338;
                color: #fff;
                display: inline;
                font-size: 14px;
                padding: 5px;
                
            }
            .btn a{color:#fff !important;}
            .btn:hover{background: #c8786f;}
            
           }
         .icon{
                @include giji;
                width: 208px;
                height: 114px;
                top:-30px;
                left:-80px;
             img{width: 80%;}
            }
    }
	.btn{
                background: #b34338;
                color: #fff;
                display: inline;
                font-size: 14px;
                padding: 5px;
                
            }
            .btn a{color:#fff !important;}
            .btn:hover{background: #c8786f;}
     .blueline{ border: 5px solid #bc8767;}
    
    .pickup_cont{
        width: 100%;
            @include flex;
            justify-content: space-between;
        flex-wrap: wrap;
        li{text-align: center;
            position: relative;
            width: 50%;
            .brand{
                font-family: $font2;
                font-size: 1.2rem;
                font-weight: 600;
                letter-spacing: 0.1em;
            }
            .red{color: $color;}
            p{font-size: 12px;
                padding: 5px;
                text-align: left;
            margin-bottom: 20px;}
            img{width: 80%;}
            .btn{
                margin: 30px 0 15px;
                
                background: #b34338;
                color: #fff;
                
                font-size: 12px;
                padding: 5px;
                /*bottom: 10px;
                right: 10px;*/
            }
            .btn a{color:#fff !important;}
            .btn:hover{background: #c8786f;}
        }
        }
    .pickup_3items{
        margin-bottom: 15px;
        @include flex;
        justify-content: space-between;
        width: 100%;
        li{width: 33%;
            .brand{font-family: $font2;
                font-size: 12px;
                font-weight: 600;
                letter-spacing: 0.1em;}
            img{width: 90%;}}
        
    }
    
    	
.button {
    margin-top: 30px;
  display: inline-block;
  text-align: center;
  text-decoration: none;
    font-family: $font2;
  outline: none;
	padding: 10px 30px;
	font-size: 1.5rem;
}
.button::before,
.button::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.button,
.button::before,
.button::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.button {
  background-color:#b72c4b;
  border: 2px solid #b72c4b;
  color: #fff !important;
}
.button:hover {
  background-color: #fff;
  border-color: #b72c4b;
  color: #b72c4b !important;
}

	
}