@charset "utf-8";
/* CSS Document */
/* responsive_green_style */



.arrow{
width:28px; height:38px;margin-top: 2rem;	
}

#catch {
color:#bf4951;
padding:1rem 0;
background-image: linear-gradient(
	-45deg,
	#f5eeed 25%,
	#f4e2de 25%,
	#f4e2de 50%,
	#f5eeed 50%,
	#f5eeed 75%,
	#f4e2de 75%,
	#f4e2de
);
background-size: 30px 30px;
background-attachment: fixed;
}



.step h4{
color:#43B8A5;
}

.pink{
	color:#43B8A5;
}

#appliciation .step .label{
	color:#FFF;
	background:#43B8A5;
	padding:0.2rem 1rem;
	border-radius: 2rem;
	display:block;
	width:5em;
	margin:auto;
	margin-bottom:0.5rem;
}



#appliciation{
display:flex;
 justify-content: space-between;	
}


.step{
	background:#f5eeed;
	border-radius: 1rem;
	margin:1rem;
	padding:0 0.5rem;
}

/*.step:after{
 content: url("/img/arrow.png");
}*/


body{
color:#333;
	margin:0;
	padding:0;
	max-width:100%;
font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',"游ゴシック",YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
}



.required{color:#FFFFFF;font-weight:bold; font-size:95%;}
.emphasis{color:#DF0522;}

.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

#wrapper{text-align:center;  margin:auto; max-width:100%;}

#header{background-color:#DF0522;text-align:left; margin:0;max-width: 90%;padding:0.5em 5%;}

h1{
	float:left;
	margin:0;
	margin-top:0.1em;
	padding:0;
	width:80px;
}


h2.pink{
color:#E34A56; 
padding:10px 10px 20px 10px;
line-height:130%;
text-align:center;
  }
		
		
h2.blue{
color:#003872; 
padding:10px 10px 20px 10px;
line-height:130%;
text-align:center;
        }

.navy_blue{color:#003C83; }

.violet{color:#674498; }

.bluegreen{color:#bf4951;}
.pink{color:#fd4899;}
.yellow{color:#f4e004;}
.green{color:#02d046;}
.blue{color:#02a2d0;}

.title_red{color:#43B8A5;}


.intro_desc {
width:80%;
margin:2rem auto;
text-align:left;

}

.note{	
text-align:left;
font-size:65%;
margin:0 auto;
margin-top:1rem;

}

.intro_desc .title{
color:#43B8A5;
	font-weight:bold;
	text-align:center;
	font-size:130%;
		
}


#present p{
margin:2rem auto;
text-align:left;	
	
}

#present p em{
font-style: normal;
background:#f8ccd2;
	
}


#header ul{
text-align:right;	
float:right;
margin:10px 0;
margin-right:20px;
}


#header ul li{

display:inline;	
margin:0;

}

#header ul li img{
max-width:30px;
	
}


#container{text-align:center; margin-left:auto;margin-right:auto;max-width:80%;
}

#unquet_contents{
text-align:left;
margin:auto;
width:80%;
}

.clear{
	clear:both;
}

label{display:block;margin-bottom:1.2em;}
.clear{clear:both;}
label.last{width:20em; }
p{margin-bottom:1em; text-align:left;}

label2{display:block;margin-bottom:1.2em;}
.clear{clear:both;}
label2.last{width:20em; }
p{margin-bottom:1em; text-align:left;}

.intro{
 padding:0;
 padding-bottom:1em;
 display:block;
 width:100%;
 margin:auto;
	
 }

.intro p{text-align:center;}


.description{
 padding:0;
 padding-bottom:1em;
 display:block;
 /*max-width:980px;*/
 margin:2em auto;
 }


.bg{
background-color:#ededed;	
 
 }
 
 .description ul{
text-align:left;
margin:auto;
width:90%;	 
 }

.description p{
text-align:left;
margin:auto;
width:90%;	
font-size:110%;
margin-bottom:1em;
 }

ul li{
margin-bottom:1em; margin-left:1em;text-indent:0; text-align:left;}

ul{
padding-left:1em;	
}


h3{

border-bottom:2px solid #bf4951;
display:inline-block;
padding-bottom:0.2rem;
	font-size:140%;
}

.h4_pink{

border-bottom:2px solid #fd4899;
display:inline-block;
padding-bottom:0.2rem;
	font-size:110%;
}

.h4_yellow{

border-bottom:2px solid #f4e004;
display:inline-block;
padding-bottom:0.2rem;
	font-size:110%;
}

.h4_green{

border-bottom:2px solid #02d046;
display:inline-block;
padding-bottom:0.2rem;
	font-size:110%;
}

.h4_blue{

border-bottom:2px solid #02a2d0;
display:inline-block;
padding-bottom:0.2rem;
	font-size:110%;
}


.center{text-align:center;
}


.en{font-weight:bold;}


input[type="text"]{height:1.5em; width:100%;　border-radius:4px;  font-size:18px; !important }

textarea {height:100px;width:95%;　border-radius: 4px; font-size:18px;}

#unquet_contents{
text-align:left;
margin:auto;
width:90%;
}
#unquet_contents h2{
	
	text-align:center;
	font-size:130%;
}


#submitArea{
width:19em;
margin:auto;
margin-top:20px;
margin-bottom:20px;

}

input[type="reset"],
input[type="button"]{

	margin-left:1em;
}




input[type="button"],
input[type="submit"],
input[type="reset"]{

    -webkit-appearance: none;
	font-size:20px;
	display:inline;
	padding:10px 0;
	text-align:center;
	width:7em;
	float:left;
	background:rgba(67,184,165,1);
	border:none;
	color:#FFF;
	font-weight:bold;
	border-radius: 4px
  }
  
  
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover {

    -webkit-appearance: none;
	font-size:20px;
	display:inline;
	padding:10px 0;
	text-align:center;
	width:7em;
	float:left;
	background:rgba(67,184,165,0.5);
	border:none;
	color:#FFF;
	font-weight:bold;
	border-radius: 4px
  }
  


.title_bg{
	
padding:10px;
border: 0;
border-radius: 4px;
background:#43B8A5;
padding:10px;	
margin: 10px 0;
margin-bottom:1em;
text-align:left;
max-height: 100%;
color:#FFFFFF;
	
}


select{padding:10px 10px;font-size:18px;}  
select.item { min-width:70%;} 

.error{color:#F00;font-size:120%;display:block; clear:both; }

img{max-width:100%;}

label{
float:left;
margin-right:1.5em;
}

label2{
float:left;
margin-right:1.5em;
text-align: center;	
}


#finish_button{
	
	font-size:20px;
	display:inline;
	padding:0.5em;
	text-align:center;
	width:13em;
	float:left;
	background-color:rgba(67,184,165,1);	
	border:none;
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
	border-radius:4px;
	
}

#finish_button a{
color:#FFF;
text-decoration:none;
	
}


#finish_button a:hover{
background-color:rgba(67,184,165,0.5);	
}

.finish_comment{
	text-align:center;	
	}


input[type="text"]{height:2em; width:100%;　border-radius:4px;  !important }
textarea {height:100px;width:95%;　border-radius: 4px; !important}
input[type="text"].w50{width:50%; margin-left:10px;}
.search_button input[type="button"]{border-radius: 4px;  width:12rem; padding:10px; font-size:60%;}


#postalcode{

	}

.f-left{
	float:left;
	
}

#postalcode input[type="text"] {
	
float:left;
width:8em;
}
		
.sp_only{display:none;}
.pc_only{display:block;}

#postalcode input[type="button"]{
	
	 -webkit-appearance: none;
	font-size:90%;
	padding:0.5em;
	text-align:center;
	float:left;
	background-color:#43B8A5;
	border:none;
	color:#FFF;
	font-weight:bold;
	border-radius: 4px;
	display:block;
	width:9em;

	}


#postalcode input[type="button"]:hover{
	
background-color:rgba(67,184,165,0.5);
	       
} 


.products_button a{
		color:#FFF;
		background-color:rgba(223,6,35,1);
		font-weight:bold;
		padding:1em ;
		width:60%;
		margin:1em auto;
		display:block;
		text-align:center;
		border-radius:4px; 
		text-decoration:none;
	
}


.products_button a:hover{
	
	background-color:rgba(223,6,35,0.5);
	         
}


.product_list{
display:flex;
justify-content: center;
	
}

.product_list p{
	display:flex;
	flex-direction:column;	
}


.product_list .box{
display:flex;	
flex-direction:column;		
}

.subtext{

	margin-bottom:0.3rem;

}

.subtext_box{
	margin-bottom:1.5rem;
}

.fixed{position:fixed; top:0; left:0; width:100%;}

/*----応募規約内の同意ボタンの囲み----*/

.btn_doui{
	border:#43B8A5 2px solid;
	padding:0.5rem;
	width:80%;
    margin:0 auto;
	display:inline-block;
	color:#43B8A5;
	font-weight:bold;
	margin-top:1rem;
}

nav{

	margin-bottom:2rem;
	
}

nav ul{
width:95%;
margin-left:auto;
margin-right:auto;
padding-left:0;	
display: -webkit-flex; 
display: flex;
 -webkit-justify-content: center; 
 justify-content:         center;


}

nav li
{
padding:0.5rem 1rem;
/*display:inline-block;*/
text-align:center;	
vertical-align:middle;
border:1px solid #bf4951;
list-style: none;
margin-left:0;
width:25%;
}

nav li a{
font-weight:bold;
color:rgba(223,6,35,1);
display:inline;
font-size:100%;
text-decoration: none;	
}


nav li img{

vertical-align:middle;
width:2rem;
height:auto;
}


nav ul.fixed{
	
display: -webkit-flex; 
display: flex;
width:100%;


}



nav.fixed{
background:rgba(255,255,255,0.8);

}

#method .flex{
margin-bottom:3rem;
-webkit-justify-content: space-between; 
  justify-content:         space-between;
width:100%;	
	
}



#method .right_contents{
text-align:right;
width:50%;
float: right;	
}


#method .right_contents img{
	max-width:45%
	margin:1em auto;
	
}

#method{
background:#F8F8F8;
padding:1rem;
margin: 0 auto;	
	
}

#method .left_contents .f_right{


	
}
#method .left_contents p.right{

display:block;

	
}


#method .left_contents{
	width:50%;
	float: left;
}

#method .left_contents .f_left{

}

#method .left_contents .f_right{
/*float:left;*/
	margin-left:1rem;
}

#foo{

	display:block;
	font-weight:bold;
	font-size:110%;
	margin:1em  0;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	text-align:left;
	padding:0;

}

.inner{
	
	width:90%;
	margin:0 auto;
		
}

.step02{
color:#FFFFFF;
padding:1.3em 0.8em;
border-radius: 0.5em;
display:inline-block;
background:#725C4E;
}

.desc{
	margin-bottom:1rem;
	text-align: left;
}

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

/*インスタリンクボタンとハッシュタグコピーボタン*/
.link_btn{
	background:#897a7a;
	border-radius:10px;
	padding:0.5em 1em;
	width:16em;	
	color:#FFFFFF;
	min-height:3em;

	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	margin-bottom:1rem;
	margin:0 auto 1rem auto;
	
}

.link_btn a{
	color:#FFFFFF;
	font-weight:bold;
}


.link_btn .icon{
float:left;	
color:#FFFFFF;
font-size:250%;
padding-top:0.1em;
background-image: url("img/icon_tag.png");
background-repeat: no-repeat;	
}

.link_btn p{
	float:right;
	margin:5px 0 0 0;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.link_btn button{
	float:left;
	margin-bottom:0;
	color:#FFFFFF;
	font-weight:bold;
	vertical-align:middle;
	background:inherit;
	-webkit-appearance: none;
	border:0;
	font-size:100%;
	padding-top:0.8em;
	margin-left:1em;
font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.link_btn01{
	/*background:#897a7a;*/
	background-image: url("img/link_btn01.png");
	background-repeat: no-repeat;
	border-radius:10px;
	padding:0.5em;
	width:16em;	
	color:#FFFFFF;
	min-height:3em;

	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	margin-bottom:1rem;
	margin:0 auto 1rem auto;
	
}

.link_btn01 a{
	color:#FFFFFF;
	font-weight:bold;
}


.link_btn01 .icon{
float:left;	
color:#FFFFFF;
font-size:250%;
padding-top:0.1em;
	
}

.link_btn01 p{
	float:right;
	margin:5px 0 0 0;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.link_btn01 button{
	float:left;
	margin-bottom:0;
	color:#FFFFFF;
	font-weight:bold;
	vertical-align:middle;
	background:inherit;
	-webkit-appearance: none;
	border:0;
	font-size:100%;
	padding-top:0.8em;
	margin-left:1em;
font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.link_btn02{
	/*background:#897a7a;*/
	background-image: url("img/link_btn02.png");
	background-repeat: no-repeat;
	border-radius:10px;
	padding:0.5em 1em;
	width:16em;	
	color:#FFFFFF;
	min-height:3em;

	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	margin-bottom:1rem;
	margin:0 auto 1rem auto;
	
}

.link_btn02 a{
	color:#FFFFFF;
	font-weight:bold;
}


.link_btn02 .icon{
float:left;	
color:#FFFFFF;
font-size:250%;
padding-top:0.1em;
	
}

.link_btn02 p{
	float:right;
	margin:5px 0 0 0;
	font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.link_btn02 button{
	float:left;
	margin-bottom:0;
	color:#FFFFFF;
	font-weight:bold;
	vertical-align:middle;
	background:inherit;
	-webkit-appearance: none;
	border:0;
	font-size:100%;
	padding-top:0.8em;
	margin-left:1em;
font-family: 'Avenir Next','Avenir', 'Helvetica Neue','Helvetica Neue','Helvetica',YuGothic,'Yu Gothic','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',"メイリオ",Meiryo,"ＭＳＰゴシック",sans-serif;
	
}

.cf {
    *zoom: 1;
}


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

	
p{margin: 1rem;	}
	
.step h4{
	margin:1rem auto;
	}

.arrow{
transform: rotate(90deg);
	margin:0 auto;
}	
	
	
	
#container{text-align:center; ;margin-left:auto;margin-right:auto;max-width:100%;
}
	
.w100{width:100%;
	
}	
	
	
#appliciation{

flex-direction: column;	
}	
	
.step{
width:95%;
margin:1rem auto;
padding:0;
	}
	
.product_list{
display:flex;
flex-direction:column;	
	
}

.product_list .box{
display:flex;	
flex-direction:row;		
}	
	
	
	
.intro .note{	
font-size:70%;
}


	
.intro{
 padding:0;
 padding-bottom:1em;
 display:block;
 width:90%;
 margin:auto;

 }	
	

#wrapper{max-width:100%;}


#header ul{
max-width:50%;
margin-right:10px;	
}

#header ul{
text-align:right;	
float:right;
margin:0;
margin-right:1em;
}

h1{
	max-width:20%;
}


#header ul img{
max-width:12%;
	
}

ul li{
margin-bottom:0em; margin-right:1%;text-indent:0; text-align:left;}

p{max-height:100%;  }

input[type="radio"],
input[type="checkbox"]
{height:20px;width:20px; vertical-align:middle;}

input[type="button"],
input[type="submit"],
input[type="reset"]{
    -webkit-appearance: none;
  }
  
select{padding:10px 20px;}
textarea {height:5em;}
label{display:block;margin-bottom:1em;text-indent:-30px; margin-left:30px;}
label2{display:block;margin-bottom:1em; margin-left:30px;}	
.title_bg{
font-size:120%;
}

h2.pink{
color:#E34A56; 
padding:10px 10px 20px 10px;
line-height:130%;
text-align:center;


        }
			
h2.blue{
color:#003872; 
padding:10px 10px 20px 10px;
line-height:130%;
text-align:center;
     }
	
h2{
color:#003872; 
padding:10px 10px 20px 10px;
line-height:130%;
text-align:center;

        }
	
		
.sp_only{display:block;}

.pc_only{display:none;}

.products_button a{

		width:90%;
	
}
	
.title_bg{margin-top:1em;}
	
.intro_desc .title{
font-size:120%;
		
}	

nav li a{
font-size:70%;
}
	
nav{
margin-bottom:1rem;
}

nav li
{
padding:0.5rem;
/*display:inline-block;*/
text-align:center;	
vertical-align:middle;
border:1px solid rgba(223,6,35,1);
width:25%;
	margin:0;
}
	
#method .flex{
	flex-direction:column;

	}
	
#method .left_contents{
	
	float:none;
	width:95%;
	display:inline-block;
	margin:0 auto;
	
}
	
#method .left_contents p,
#method .left_contents .note{
		
		
	}
	
	
	
#method .right_contents{
	float:none;	
	margin: 0 auto;
	width:95%;
	text-align:center;
	margin-bottom:2em;

}
		

#method .right_contennts img{
	max-width:100%
	margin:1em auto;
	
}	
	
#method .left_contents pre{
		
	}	
		
	
#method .left_contents p.right{
	width:100%;
	float:none;
	margin:0 auto;
	padding:0;
	
}
	
.inner{
	
	width:100%;
	margin:0 auto;
	
}
	
#foo{
	width:50%;
	/*display:inline-block;*/
	font-weight:bold;
	font-size:120%;
	


	}
	
/*インスタリンクボタンとハッシュタグコピーボタン*/
.link_btn{
	background:#897a7a;
	border-radius:10px;
	padding:0.5em 0.8em;  
	max-width:100%;	
	color:#FFFFFF;
	min-height:3em;
	margin:1rem auto;
	
}

	.link_btn p{
		
	margin: 0 16px 0;
	}	
	
	.link_btn p span{
		
	letter-spacing:-0.1em;
	}
	
.link_btn01{
	/*background:#897a7a;*/
	background-image: url("img/link_btn01.png");
	background-repeat: no-repeat;
	border-radius:10px;
	padding:0.5em 0.8em;  
	max-width:100%;	
	color:#FFFFFF;
	min-height:3em;
	margin:1rem auto;
	
}

	.link_btn01 p{
		
	margin: 0 16px 0;
	}	
	
	.link_btn01 p span{
		
	letter-spacing:-0.1em;
	}
	
.link_btn02{
	/*background:#897a7a;*/
	background-image: url("img/link_btn02.png");
	background-repeat: no-repeat;
	border-radius:10px;
	padding:0.5em 0.8em;  
	max-width:100%;	
	color:#FFFFFF;
	min-height:3em;
	margin:1rem auto;
	
}

	.link_btn02 p{
		
	margin: 5px 16px 0;
	}	
	
	.link_btn02 p span{
		
	letter-spacing:-0.1em;
	}	
	
.note{	
	margin-bottom: 1em;
}