@charset "utf-8";
/* CSS Document */




/****活動用****/
.blackbarnew{
    top:0;
	left:0;
	width:100%;
	height:30px;
    padding:0 10px;
	background-color:#000;
	position: fixed;
	z-index:999;
	overflow: hidden;}

.yeslogo{font-size: 12px; color: #fff; line-height: 30px; letter-spacing: 2px; float: left;}

.yeslogo i{margin-right: 8px; float: left;}

.yeslogo i img{width: 10px; margin-top: 10px;}

.yesgogo{font-size: 12px; color: #fff; line-height: 30px; letter-spacing: 2px; float: right;}

.yesyes{font-size: 15px; color: #fff; font-weight: bold; line-height: 30px; letter-spacing: 1px; margin-right: 4px;}



/****/

.header_6{width: 100%; height: 60px;  position: fixed; z-index:9999999; top:30px; border-bottom:0px solid #ddd; box-shadow: 0 2px 4px rgba(0,0,0,0.1); 
     background-color: rgba(255,255,255,1); transform: all .3s;}

.header_go{border-bottom:1px solid #ddd; box-shadow: 0 2px 4px rgba(0,0,0,0.1); background-color: #fff;}

.logo_6{float: left; font-size: 30px; color: #fff; line-height: 60px; margin-left: 0px; }


.meun{float: right; margin-right: 0px;}

.meun ul{overflow: hidden;}

.meun li{float: left; line-height: 60px; color: #000; }

.meun li div{color: #f6516b; transition: all .3s; padding: 0 16px; font-size: 18px;}

.meun li div:hover{background-color: #f6516b; color:#fff }

.micon{width: 60px; height: 60px; line-height: 60px; text-align: center; color: #fff; font-size: 30px; float: right; display: none; transition: all .3s; opacity: 0.6;
    background-image: url("../img/menu.png"); background-repeat: no-repeat; background-size: 120px; background-position: center left;}

.op5{background-position: center right; }

@media screen and (max-width: 980px) {
    
.meun{margin-right:0px; position: fixed; top:90px; right: 0; width: 100%; display: none; z-index: 88;}    
 .meun li{float: none; width: 100%; border-bottom: 1px solid #ff7c91;} 
.meun li div{width: 100%; background-color: #f6516b; text-align: center; color: #fff;}
 .micon{display: block;}   
}

@media screen and (max-width: 736px) {

}





/*GOGO*/




body{ background-color: #f1e8e2;}


.bg{position: fixed; top:0; left: 0; bottom: 0; right: 0; z-index: -1;  background-color: #f1e8e2; overflow: hidden; 
    /*background-image: url("../img/bg.jpg"); background-position: center; background-repeat: repeat-y; background-size: 100%;*/}








.box01{margin-top:90px; width: 100%;  position: relative; z-index: 1;
    background-image: url("../img/foc.jpg"); background-position: top center; background-repeat: no-repeat; background-size: cover;
}


.box01s{max-width: 950px; margin: 0 auto; height: 720px; position: relative; text-align: center; padding-top: 54px;}


.box01s img{max-width: 850px; transform: rotate(3deg); }



/*
.boxright{position: absolute; width: 200px; height: 600px; right: -220px; top:100px; z-index: 3; background-color: #fff; border-radius: 8px; border:4px solid #ff6079;}
*/


@media screen and (max-width: 980px) {

    .box01s img{padding: 0 16px;}
    
    .box01s{height: 600px; overflow: hidden; padding-top: 40px;}
}

@media screen and (max-width: 736px) {

    
    .box01s{height: 280px;overflow: hidden;padding-top: 20px;}
}







.page{max-width: 950px; margin: 0 auto; position: relative; z-index: 2; margin-top: -100px; padding-bottom: 60px;}


@media screen and (max-width: 980px) {

    .page{ padding: 0 16px 60px; margin-top: -80px;}
}

@media screen and (max-width: 736px) {

    .page{margin-top: -0px;padding: 0 16px 80px;}
}



.box02{width: 100%; position: relative; background-color: #fff; border-radius: 8px; border:2px solid #ff6079; padding: 12px; 
   box-shadow: 0px 4px 0 #ff6079;}


.box02 > h1{position: absolute; z-index: 3; top:-42px; left: 12px; font-size: 26px; color: #fff; background-color: #ff6079; padding: 8px 10px 6px 8px;
    border-radius: 8px 8px 0 0; font-weight: bold; letter-spacing: 2px; text-indent: 2px;}

.box02 > h1:before{content: ""; width: 26px; height: 26px; background-image: url("../img/icon.png"); background-size: cover; display: inline-block; position: relative; 
    margin-bottom: -2px; margin-right: 8px;}

@media screen and (max-width: 736px) {

    .box02 > h1{left: 50%; transform: translateX(-50%); width: 200px; font-size: 24px; text-align: center;}
    .box02 > h1:before{width: 24px; height: 24px;}
}





.box3big{width: 100%; position: relative;}




.mb70{margin-bottom: 70px;}

.mb30{margin-bottom: 30px;}

@media screen and (max-width: 736px) {

.mb30{margin-bottom: 20px;}
    
}





.box02s{width: 100%; position: relative; text-align: center; }

.namebox{ width: 100%; padding: 12px 0px; background-color: #ffeed4; border-radius: 8px;}

.namebox h2{font-size: 24px; margin-bottom: 8px; color: #666;}
.namebox h3{font-size: 20px; color: #ff6079;}

@media screen and (max-width: 736px) {

.namebox{padding: 10px 0px;}    
.namebox h2{font-size: 20px;}
.namebox h3{font-size: 18px;}
}









.box04{width: 100%; background-color: #fff; border-radius: 8px; border:2px solid #ff6079; padding: 16px; box-shadow: 0px 4px 0 #ff6079; position: relative;}

.box04 > h1{  font-size: 20px; color: #fff; background-color: #ff6079; padding: 8px 12px; border-radius: 8px; 
    display: inline-block; font-weight: bold; position: relative; margin: -8px 0 16px -8px;}
/*
.box04 > h1:before{content: ""; width: 20px; height: 20px; background-image: url("../img/icon.png"); background-size: cover; display: inline-block; 
    position: relative; margin-bottom: -2px; margin-right: 8px;}*/

.list{padding-left: 20px;}

.list li{font-size: 16px; color: #666; line-height: 1.5; margin-bottom: 10px; list-style: decimal;}

.list li:last-child{list-style: none; margin-bottom: 0; color: #ba4b5d;}






/*

.data{text-align: center; position: relative; width: 100%; margin-bottom: 20px;}

.data h1{background-color: #f1e8e2; padding: 10px 16px; color: #ba4b5d; font-size: 22px; display: inline-block; position: relative; z-index: 2;}

.data:before{content: ""; position: absolute; top:50%; left: 0; width: 100%; height: 2px; background-color: #ba4b5d; z-index: 0;}

@media screen and (max-width: 736px) {

    .data h1{font-size: 16px; line-height: 1.5; padding:10px; border:1px solid #ba4b5d; width: 100%; border-radius: 6px;} 
    
    .data:before{display: none;}
    
}

*/



.data{width: 100%; position: relative; margin-bottom: 20px; padding:10px 10px; border-radius: 8px; border: 2px solid #ba4b5d;}


.data ul{overflow: hidden}


.data li h1{color: #ba4b5d; font-size: 22px; line-height: 38px;}


.data li{float:left;}


.data li:nth-child(1){width: calc(100% - 134px);}
.data li:nth-child(2){width:134px;}



.go2{width:calc(100%); padding: 10px; background-color: #ba4b5d; border-radius: 6px; text-align: center; font-size: 18px; color: #fff; 
    border:0px solid #ff6079; transition: all .3s;}

.go2:hover{background-color: #ff6079; }



@media screen and (max-width: 736px) {

.data{border-radius: 6px;}    
.data li h1{font-size: 16px; line-height: 1.5;}
.data li:nth-child(1){width:100%; margin-bottom: 10px;}
.data li:nth-child(2){width:100%;}
    
}











.box032{width: 100%; position: relative;}

.box032 > ul{ overflow: hidden;}

.box032 > ul > li{width: calc(50% - 10px); margin-right: 20px; float: left; padding-bottom: 4px;}

.box032 > ul > li:last-child{margin: 0;}

.gobox{position: absolute; width: 134px; right: 10px; bottom: 10px; z-index: 8;}


@media screen and (max-width: 736px) {

    .box032 > ul > li{width: 100%; margin-right: 0; margin-bottom: 20px;}
    
}









.box03{width: 100%; position: relative;}

.box03 > ul{ overflow: hidden;}

.box03 > ul > li{width: calc(33.33% - 10px); margin-right: 15px; float: left; padding-bottom: 4px;}

.box03 > ul > li:last-child{margin: 0;}


@media screen and (max-width: 736px) {

    .box03 > ul > li{width: 100%; margin-right: 0; margin-bottom: 20px;}
    
}







.box03s{width: 100%; height: 290px; position: relative; background-color: #fff; border-radius: 8px;  border:2px solid #ff6079; box-shadow: 0px 4px 0 #ff6079; 
    padding-bottom: 50px;}

.box03s > h1{width: 100%; padding: 10px 8px; background-color: #ff6079; text-align: center; font-size: 24px; color: #fff; font-weight: bold;}

.box03s > p{padding: 16px; font-size: 18px; color: #666; line-height: 1.5;}


.go{width:calc(100%); padding: 10px; background-color: #fff3b2; border-radius: 6px; text-align: center; font-size: 18px; color: #ba4b5d; 
    border:0px solid #ff6079; transition: all .3s;}

.go:hover{background-color: #ffed87; }

.boxgo2{overflow: hidden; padding:0 7px; position: absolute; bottom: 10px; width: 100%; }

.boxgo2 li{float: left; width: 50%; padding: 0 5px;}


.boxman{overflow: hidden; padding: 16px;}

.boxman li{font-size: 18px; color: #ff772d; line-height: 1.5; margin-bottom: 10px; list-style:disc; margin-left: 20px;}

.boxman li:nth-child(1){margin-bottom: 16px; border-bottom: 1px dashed #ddd; padding-bottom: 6px; color: #333; list-style:none; margin-left: 0;}

.boxman li:last-child{margin-bottom: 0;}

@media screen and (max-width: 980px) {


}

@media screen and (max-width: 736px) {

    .box03s{height: auto; padding-bottom: 94px;}
    .hh{height: auto; padding-bottom: 50px;}
    
}







.food{background-image: url("../img/food.png"); background-repeat: no-repeat; background-size: contain; background-position: center bottom;}
.gift{background-image: url("../img/gift.png"); background-repeat: no-repeat; background-size: contain; background-position: left bottom;}
.man{background-image: url("../img/man.png"); background-repeat: no-repeat; background-size: contain; background-position: left bottom;}
.no{background-image: url("../img/no.png"); background-repeat: no-repeat; background-size: contain; background-position: center bottom;}

@media screen and (max-width: 736px) {

    .food{background-size:80%;}
    .gift{background-size:95%;}
    
}



.logo_list{overflow: hidden;}

.logo_list li{width: calc(100% / 2); float: left;}

@media screen and (max-width: 736px) {

    .logo_list li{width:100%; margin-bottom: 0px;}
    
    .logo_list li:last-child{margin: 0;}
    
}




.tag{position: absolute; top:-120px;}





.snowfall-flakes{ animation-iteration-count: infinite; animation-duration: 0.8s;  animation-name: swing2; opacity: 0.5;}

@-webkit-keyframes swing2 {
  20% {
    transform: rotate3d(0, 0, 1, 30deg);
  }

  40% {
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    transform: rotate3d(0, 0, 1, 20deg);
  }

  80% {
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}







.work_video{width: 100%;}
.work_video {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.work_video iframe, .work_video object, .work_video embed {
position: absolute;
top: 0;left: 0;
width: 100%;
height: 100%;}






.mdfooter{width: 100%; position: fixed; bottom: 0; left: 0; z-index: 9999999; background-color: #ba4b5d; display: none;}
.mdfooter_s{max-width: 950px; margin: 0 auto;  position: relative; height: 58px;}

@media screen and (max-width: 736px) {
    .mdfooter{display: block;}
}




.good{width: 100%; margin-bottom: 16px; background-color: #ddd; border-radius: 15px; height: 30px;}
.goods{ height: 30px;  border-radius: 15px; background-color: #ff788d; color: #fff; text-align: right; 
    font-size: 16px; line-height: 30px; padding-right: 8px; font-weight: bold;}
.goodman{overflow: hidden; margin-bottom: 10px; padding: 0 8px;}
.goodman li{ float: left; color: #666; font-size: 16px;}
.goodman li:nth-child(1){text-align: left; width: 40%;}
.goodman li:nth-child(2){text-align: right; width: 60%;}






