@charset "utf-8";


/* ----------------------------------------

  p e a s t r a p <3<3<3

	0. default(reset)
	1. layout
	2. box
	3. link
	4. image
	5. form
	6. list
	7. button
		7-1. fix footer button
	8. extension
		8-1. sns share
		8-2. meter
		8-3. popup

---------------------------------------- */

/* ----------------------------------------
	0. default(reset)
---------------------------------------- */

*{
	margin:0;
	padding:0;
	font-style:normal;
	letter-spacing:0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

html {overflow-y:scroll;}

p {margin:0;}

ul , li{list-style-type:none;}

img{
	border:0;
	/*vertical-align:bottom; 2015/06/09*/
}

textarea{font-size:100%;}

form, fieldset, input, button{
	margin:0;
	padding:0;
	font-size:100%;
}

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

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

em {
	display: table;
	clear: both;
}

/* ----------------------------------------
	1. layout
---------------------------------------- */

/*%*/
.w100 { width:100%;}
.w98 { width:98%; margin:0 auto;}
.w95 { width:95%; margin:0 auto;}
.w90 { width:90%; margin:0 auto;}
.w80 { width:80%; margin:0 auto;}
.w75 { width:75%; margin:0 auto;}
.w70 { width:70%; margin:0 auto;}
.w60 { width:60%; margin:0 auto;}
.w50 { width:50%; margin:0 auto;}
.w40 { width:40%; margin:0 auto;}
.w30 { width:30%; margin:0 auto;}
.w20 { width:20%; margin:0 auto;}

/*pw*/
.w980 { width:980px; margin:0 auto;}

/*grid(width%)*/
.grid1, .grid2, .grid3, .grid4, .grid5 {
	float: left;
	display: inline;
	/*margin-left: 20px;*/
}
.grid1 { width:100%; display:block;}
.grid2 { width:50%; display:block;}
.grid3 { width:33.3333333%; display:block;}
.grid4 { width:25%; display:block;}
.grid5 { width:20%; display:block;}

/* clearfix */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
 /* IE6 */
* html .clearfix { zoom: 1;}
 /* IE7 */
*:first-child+html .clearfix {zoom: 1;}

/* ----------------------------------------
	2. box
---------------------------------------- */

/* ----------------------------------------
	3. link
---------------------------------------- */

/* ----------------------------------------
	4. image
---------------------------------------- */

/*4-1. circle image*/

.img01_1 {
	height:*;
	width:*;
	background-size: cover;
	background-position:center center;
	border-radius: 50%; 
	-webkit-border-radius: 50%; 
	-moz-border-radius: 50%;
	position:relative;
	cursor:pointer;
}

.img01_1 span {
	position:absolute;
	top:*;
	left:*;
}

/* ----------------------------------------
	5. form
---------------------------------------- */

/*5-1. form input01*/

.form01 {
	background-color:#fff;
	padding:5px 12px;
	-webkit-border-radius: 50px;
	-moz-border-radius:50px;
	border-radius: 50px;
}

	.form01 input[type="text"] {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:0;
		
		padding:10px;
		background:none;
	}

/*5-2. form set*/

.form02 {
	*
}

	.form02 ul {
		*
	}
	
		.form02 ul li {
			width:100%;
		}
		
			.form02 ul li dl {
				width:100%;
			}
				
				.form02 ul li dl dt{
					width:50%;
					float:left;
					padding-right:10px;
				}
				
				.form02 ul li dl dd{
					width:50%;
					float:left;
				}
				
				.form02 ul li dl dd:after{
					clear:both;
				}
				
				.form02 ul li input[type="input"] {
					/*reset*/
					-webkit-appearance:none;!important
					-moz-appearance:none;!important
					appearance:none;!important
					outline-style:none;
					border:0;
					
					padding:10px;
					background-color:#202a31;
				}
				
				.form02 ul li textarea {
					/*reset*/
					-webkit-appearance:none;!important
					-moz-appearance:none;!important
					appearance:none;!important
					outline-style:none;
					border:0;
					
					padding:10px;
					width:100%;
					height:100px;
					background-color:#202a31;
					/*font*/
					color:#fff;
				}
				
				@media (max-width: 900px) {
				.form02 ul li textarea {
					height:80px;
				}
				}

/*5-3. form set*/

.form03 {
	*
}

	.form03 ul {
		*
	}
	
		.form03 ul li {
			width:100%;
		}
		
			.form03 ul li dl {
				width:100%;
			}
				
				.form03 ul li dl dt{
					width:50%;
					float:left;
					padding-right:10px;
				}
				
				.form03 ul li dl dd{
					width:50%;
					float:left;
				}
				
				.form03 ul li dl dd:after{
					clear:both;
				}
				
				.form03 ul li input[type="input"] {
					/*reset*/
					-webkit-appearance:none;!important
					-moz-appearance:none;!important
					appearance:none;!important
					outline-style:none;
					border:0;
					
					padding:20px;
					border:#c1c1c1 solid 1px;
					
					/*css3*/
					-webkit-border-radius: 5px;
					-moz-border-radius: 5px;
					border-radius: 5px;
				}
				
				.form03 ul li select {
					-webkit-appearance: none;
					-moz-appearance: none;
					appearance: none;
					text-indent: .01px;
					
					display:block;
					padding:8px 50px 8px 8px;
					border: 1px solid #ccc;
					border-radius: 4px;
					text-overflow: "";
					background: #FFF url(../assets/svg/arrow01.svg);
					background-size: 10px 10px;
					background-position: 90%  center;
					background-repeat: no-repeat;
					
					/*font*/
					color: #666;
					font-size: 100%;
				}
				
				.form03 ul li textarea {
					/*reset*/
					-webkit-appearance:none;!important
					-moz-appearance:none;!important
					appearance:none;!important
					outline-style:none;
					border:0;
					
					padding:20px;
					width:100%;
					height:100px;
					border:#c1c1c1 solid 1px;
					
					/*css3*/
					-webkit-border-radius: 5px;
					-moz-border-radius: 5px;
					border-radius: 5px;
					
					/*font*/
					color:#333;
				}
				
				@media (max-width: 900px) {
				.form03 ul li textarea {
					height:80px;
				}
				}

/*5-3. select(pulldown)*/

select.select01/*flat*/ {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	text-indent: .01px;
	
	display:block;
	padding:8px 30px 8px 8px;
	border: 1px solid #ccc;
	border-radius: 4px;
	text-overflow: "";
	background: #FFF url(../assets/svg/arrow01.svg);
	background-size: 10px 10px;
	background-position: 90%  center;
	background-repeat: no-repeat;
	
	/*font*/
	color: #666;
	font-size: 100%;
}

/*5-4. form set(吹き出しshape)*/

.form04 {
	padding:20px;
	position: relative;
	border: 1px solid #d2d2d2;
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.form04:after, .form04:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.form04:after {
	border-color: rgba(251, 255, 245, 0);
	border-top-color: #fbfff5;
	border-width: 10px;
	margin-left: -10px;
}
.form04:before {
	border-color: rgba(210, 210, 210, 0);
	border-top-color: #d2d2d2;
	border-width: 11px;
	margin-left: -11px;
}

	.form04 textarea {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:1px solid;
		
		width:100%;
		height:100px;
		
		/*css3*/
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		
		/*font*/
		color:#8e8e8e;
		
		position:relative;
	}
	.form04 .input_guide {
		margin: 10px;
		margin-left: 0;
		font-size: 0.4em;
		color: #7b7b7b;
	}
	
/*5-5. form set(check box)*/

.form05 input[type=radio],
.form05 input[type=checkbox] {
    display: inline-block;
    margin-right: 6px;
}
.form05 input[type=radio] + label,
.form05 input[type=checkbox] + label {
    position: relative;
      
    display: inline-block;
    margin-right: 12px;
		
    line-height: 30px;
      
    cursor: pointer;
}
  
@media (min-width: 1px) {
    .form05 input[type=radio],
    .form05 input[type=checkbox] {
        display: none;
        margin: 0;
    }
    .form05 input[type=radio] + label,
    .form05 input[type=checkbox] + label {
        padding: 0 0 0 24px;
    }
    .form05 input[type=radio] + label::before,
    .form05 input[type=checkbox] + label::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
          
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
        width: 18px;
        height: 18px;
        margin-top: -9px;
          
        background: #FFF;
    }
    .form05 input[type=radio] + label::before {
        border: 2px solid #ccc;
        border-radius: 30px;
    }
    .form05 input[type=checkbox] + label::before {
        border: 1px solid #ccc;
    }
    .form05 input[type=radio]:checked + label::after,
    .form05 input[type=checkbox]:checked + label::after {
        content: "";
        position: absolute;
        top: 50%;
          
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
    }
    .form05 input[type=radio]:checked + label::after {
        left: 5px;
          
        width: 8px;
        height: 8px;
        margin-top: -4px;
          
        background: #E71063;
        border-radius: 8px;
    }
    .form05 input[type=checkbox]:checked + label::after {
        left: 3px;
          
        width: 16px;
        height: 8px;
        margin-top: -8px;
          
        border-left: 3px solid #E71063;
        border-bottom: 3px solid #E71063;
          
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
     
    /* either */
    .form05 .either {
        position: relative;
         
        display: inline-block;
        width: 200px;
        overflow: hidden;
        border: 1px solid #ccc;
    }
    .form05 .either input[type=radio] + label {
        position: static;
         
        float: left;
        display: block;
        width: 50%;
        margin-right: 0;
        padding: 0;
        overflow: hidden;
         
        text-align: center;
    }
    .form05 .either input[type=radio] + label::before {
        content: attr(data-label);
         
        top: 0;
        bottom: 0;
        z-index: 1;
         
        display: block;
        width: 50%;
        height: auto;
        margin-top: 0;
         
        text-align: center;
         
        color: transparent;
        background: transparent;
        border: 0 none;
        border-radius: 0;
    }
    .form05 .either input[type=radio] + label:last-child::before {
        left: 50%;
        right: 0;
         
    }
    .form05 .either input[type=radio]:checked + label::before {
        color: #fff;
    }
     
    .form05 .either input[type=radio] + label::after {
        border-radius: 0;
    }
    .form05 .either input[type=radio]:first-child + label::after {
        content: none;
    }
    .form05 .either input[type=radio] + label + input[type=radio] + label::after {
        content: "";
         
        position: absolute;
        top: 0;
        bottom: 0;
        z-index: 0;
         
        display: block;
        width: auto;
        height: auto;
        margin: auto;
         
        background: #192128;
         
        -webkit-no_transition: all 200ms;
        no_transition: all 200ms;
    }
     
    .form05 .either input[type=radio]:checked + label + input[type=radio] + label::after {
        left: 0;
        right: 50%;
    }
    .form05 .either input[type=radio] + label + input[type=radio]:checked + label::after {
        left: 50%;
        right: 0;
    }
     
}

/*5-6. form set*/

.form06 {
	*
}

	.form06 ul {
		*
	}
	
		.form06 ul li {
			width:100%;
		}
		
			.form06 ul li h3 {
				margin-bottom:5px;
				margin-top:10px;
				/*font*/
				font-weight:lighter;
				color:#ffffff;
			}
		
			.form06 ul li dl {
				width:100%;
			}
				
				.form06 ul li dl dt{
					float:left;
					padding-right:1px;
				}
				
				.form06 ul li dl dd{
					float:left;
				}
				
				.form06 ul li dl dd:after{
					clear:both;
				}
				
				.form06 ul li input[type="input"] {
					/*reset*/
					-webkit-appearance:none;!important
					-moz-appearance:none;!important
					appearance:none;!important
					outline-style:none;
					border:0;
					
					padding:12px;
				}
				
				.form06 ul li input[type="password"] {
					/*reset*/
					-webkit-appearance:none;!important
					-moz-appearance:none;!important
					appearance:none;!important
					outline-style:none;
					border:0;
					
					padding:12px;
				}
				
				.form06 ul li select {
					-webkit-appearance: none;
					-moz-appearance: none;
					appearance: none;
					text-indent: .01px;
					
					display:block;
					text-overflow: "";
					/*background: #FFF url(../assets/svg/arrow01.svg);
					background-size: 10px 10px;
					background-position: 90%  center;
					background-repeat: no-repeat;*/
					
					/*css3*/
					-webkit-border-radius: 0px;
					-moz-border-radius: 0px;
					border-radius: 0px;
					
					/*font*/
					color: #666;
					font-size: 100%;
				}
				
				.form06 ul li textarea {
					/*reset*/
					-webkit-appearance:none;!important
					-moz-appearance:none;!important
					appearance:none;!important
					outline-style:none;
					border:0;
					
					padding:20px;
					width:100%;
					height:100px;
					border:#c1c1c1 solid 1px;
					
					/*font*/
					color:#8e8e8e;
				}
				
				@media (max-width: 900px) {
				.form06 ul li textarea {
					height:80px;
				}
				}
	

/* ----------------------------------------
	6. list
---------------------------------------- */

/* ----------------------------------------
	7. button
---------------------------------------- */

.no_transition{
	-webkit-transform: translate(0, 0);
	no_transition-duration: .5s;
}

a:hover {
	-webkit-transform: translate(0, 0);
	no_transition-duration: .5s;
}

/*7-1. fix footer button*/

.f_btn01 {
	position:fixed;
	bottom:0;
	width:100%;
	padding:1em;
	background-color: rgba(0,0,0,0.8);
	z-index:9999;
}
	
	.f_btn01 .btn {
		width:30%;
		margin:0 auto;
	}
	
		.f_btn01 .btn input[type="submit"] {
			padding:1em;
			/*font*/
			font-size:100%;
			text-align:center;
			color:#fff;
			/*css3*/
			-webkit-box-shadow: inset 0 1px 1px #fff;
			-moz-box-shadow: inset 0 1px 1px #fff;
			box-shadow: inset 0 1px 1px #fff;
			border: solid 1px #298e39;
			background-image: -webkit-linear-gradient(bottom, #1f752c, #3d902f);
			background-image: -moz-linear-gradient(bottom, #1f752c, #3d902f);
			background-image: -o-linear-gradient(bottom, #1f752c, #3d902f);
			background-image: -ms-linear-gradient(bottom, #1f752c, #3d902f);
			background-image: linear-gradient(to top, #1f752c, #3d902f);
		}
	
	@media (max-width: 480px) {
	.f_btn01 .btn {
		width:90%;
		margin:0 auto;
		padding:0.5em;
		/*font*/
		font-size:90%;
	}
	}
		
		.f_btn01 .btn:hover {
			width:30%;
			margin:0 auto;
			padding:1em;
			/*font*/
			font-size:100%;
			text-align:center;
			color:#fff;
			/*css3*/
			-webkit-box-shadow: inset 0 1px 1px #fff;
			-moz-box-shadow: inset 0 1px 1px #fff;
			box-shadow: inset 0 1px 1px #fff;
			border: solid 1px #298e39;
			background-image: -webkit-linear-gradient(top, #1f752c, #3d902f);
			background-image: -moz-linear-gradient(top, #1f752c, #3d902f);
			background-image: -o-linear-gradient(top, #1f752c, #3d902f);
			background-image: -ms-linear-gradient(top, #1f752c, #3d902f);
			background-image: linear-gradient(to bottom, #1f752c, #3d902f);
		}
		
		@media (max-width: 480px) {
		.f_btn01 .btn:hover {
			width:90%;
			margin:0 auto;
			padding:0.5em;
			/*font*/
			font-size:90%;
		}
		}

			.f_btn01 .btn i {
				margin-right: 10px;
			}
			
			.f_btn01 p{
				margin-top:10px;
				/*font*/
				font-size:70%;
				text-align:center;
				color:#fff;
			}

/*7-2. sinmple button*/

	/*7-2-1：白枠ボタン*/
	.btn02_1 {
		padding:15px;
		width:100%;
		border:#fff solid 1px;
		background:none;
		/*font*/
		text-align:center;
		color:#fff;
		
		cursor:pointer;
	}
	
	.btn02_1:hover {
		background-color:rgba(255,255,255,0.8);
		/*font*/
		color:#666;
	}
	
	/*7-2-2：Facebookログインボタン*/
	.btn02_2 {
		padding:1px;
		/*font*/
		font-size:100%;
		text-align:center;
		font-family: 'nevis';
		color:#fff;
		/*css3*/
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		border-radius: 25px;
		background-color: #010101;
		background-image: -webkit-linear-gradient(bottom, #3e5c9b, #4e69a3);
		background-image: -moz-linear-gradient(bottom, #3e5c9b, #4e69a3);
		background-image: -o-linear-gradient(bottom, #3e5c9b, #4e69a3);
		background-image: -ms-linear-gradient(bottom, #3e5c9b, #4e69a3);
		background-image: linear-gradient(to top, #3e5c9b, #4e69a3);
	}
	
	.btn02_2:hover {
		background-color:#333;
	}
	
		.btn02_2 ul {
			margin:0;
			position:relative;
		}
		
			.btn02_2 ul li {
				float:left;
			}
			
			.btn02_2 ul li.icon {
				width:50px;
				height:50px;
				border-radius: 50%;
				background-color:#fff;
				/*font*/
				color:#4b67a1;
			}
			
				.btn02_2 ul li.icon i.fb {
					margin:13px 1px 0 0;
					/*font*/
					font-size:180%;
				}
			
			.btn02_2 ul li.txt {
				position:absolute;
				width:100%;
				top:15px;
				/*font*/
				font-weight:lighter;
				font-size:120%;
				letter-spacing:2px;
				text-align:center;
				color:#fff;
			}
			
			@media (max-width: 480px) {
			.btn02_2 ul li.txt {
				top:13px;
				/*font*/
				text-indent:30px;
			}
			}
	
	/*7-2-1：緑ボタン*/
	.btn02_3 {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:0;
		
		padding:15px;
		width:100%;
		background:#02a752;
		/*font*/
		text-align:center;
		color:#fff;
		
		cursor:pointer;
	}
	
	.btn02_3:hover {
		background:none;
		box-shadow: 0 0 0 1px #02a752 ;
		/*font*/
		color:#02a752;
	}

	/** 送信中の緑ボタンをグレーにする **/
	.btn02_3_msg {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:0;

		padding:15px;
		width:100%;
		background:#7B7B7B;
		/*font*/
		text-align:center;
		color:#fff;

		cursor:default;
	}

	
	/*7-2-1：緑ボタン*/
	.btn02_4 {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:0;
		
		padding:15px;
		width:100%;
		background:#04ba08;
		/*font*/
		text-align:center;
		color:#fff;
		
		cursor:pointer;
		-webkit-transform: translate(0, 0);
		no_transition-duration: .4s;
	}
	
	.btn02_4:hover {
		background:none;
		box-shadow: 0 0 0 1px #02a752 ;
		/*font*/
		color:#02a752;
		
		-webkit-transform: translate(0, 0);
		no_transition-duration: .4s;
	}
	
	/*7-2-5：detail btn*/
	.btn02_5 {
		padding:1px;
		/*font*/
		font-size:100%;
		text-align:center;
		color:#fff;
		border:#1c6cbe solid 2px;
		/*css3*/
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		border-radius: 25px;
		background-color: #4096ee;
	}
	
	.btn02_5:hover {
		background-color:#1c6cbe;
		-webkit-transform: translate(0, 0);
		no_transition-duration: .5s;
	}
	
		.btn02_5 ul {
			margin:0;
			position:relative;
		}
		
			.btn02_5 ul li {
				float:right;
			}
			
			.btn02_5 ul li.icon {
				width:50px;
				height:50px;
				border-radius: 50%;
				background-color:#1c6cbe;
				/*font*/
				color:#4096ee;
			}
			
				.btn02_5 ul li.icon i.angle-right {
					margin:7px 0 0 1PX;
					/*font*/
					font-size: 250%;
				}
			
			.btn02_5 ul li.txt {
				position:absolute;
				width:100%;
				top:9px;
				/*font*/
				font-weight:lighter;
				font-size:160%;
				text-align:center;
				color:#fff;
			}
			
			@media (max-width: 480px) {
			.btn02_5 ul li.txt {
				top:13px;
				/*font*/
				text-indent:30px;
			}
			}

	/*7-2-6：FBボタン*/
	.btn02_6 {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:0;
		
		padding:15px;
		width:100%;
		background:#3e5c9b;
		/*font*/
		text-align:center;
		color:#fff;
		
		cursor:pointer;
		-webkit-transform: translate(0, 0);
		no_transition-duration: .4s;
	}
	
	.btn02_6:hover {
		background:none;
		box-shadow: 0 0 0 1px #3e5c9b ;
		/*font*/
		color:#3e5c9b;
		
		-webkit-transform: translate(0, 0);
		no_transition-duration: .4s;
	}

	/*7-2-7：yellow ボタン*/
	.btn02_7 {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:0;
		
		padding:15px;
		width:100%;
		
		background: -webkit-linear-gradient(90deg, #fcb11c 0%, #fed82a 100%);
		background: -moz-linear-gradient(90deg, #fcb11c 0%, #fed82a 100%);
		background: -o-linear-gradient(90deg, #fcb11c 0%, #fed82a 100%);
		background: -ms-linear-gradient(90deg, #fcb11c 0%, #fed82a 100%);
		background: linear-gradient(0deg, #fcb11c 0%, #fed82a 100%);

		/*font*/
		font-size:120%;
		text-align:center;
		color:#1b4d7d;
		
		/*css3*/
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		
		cursor:pointer;
	}
	
	.btn02_7:hover {
		background:#fed82a;
	}

	/*7-2-8：緑ボタン*/
	.btn02_8 {
		/*reset*/
		-webkit-appearance:none;!important
		-moz-appearance:none;!important
		appearance:none;!important
		outline-style:none;
		border:0;
		
		padding:15px;
		width:100%;
		background:#666;
		/*font*/
		text-align:center;
		color:#fff;
		
		cursor:pointer;
	}
	
	.btn02_8:hover {
		background:none;
		box-shadow: 0 0 0 1px #ccc ;
		/*font*/
		color:#666;
	}



/* ----------------------------------------
	8. extension
---------------------------------------- */

/*8-1_1. sns share(circle)*/

.sns_share01 {
	/*custom*/
	*
}

	.sns_share01 ul {
		margin:0;
	}
	
		/* sns circle */
		.sns_share01 ul li {
				float:left;
				margin-right:10px;
				width:50px;
				height:50px;
				border-radius: 50%;
				background-color:#000;
		}
		
			.sns_share01 ul li:hover {
					float:left;
					margin-right:10px;
					width:50px;
					height:50px;
					border-radius: 50%;
					background-color:#666;
			}
			
			.sns_share01 ul li i.fb {
					margin-left: 5px;
					position:absolute;
					padding:10px;
					font-size:30px;
					color:#fff;
			}
			
			.sns_share01 ul li i.github {
					margin-left:3px;
					position:absolute;
					padding:9px;
					font-size:30px;
					color:#fff;
			}
			
			.sns_share01 ul li i.globe {
					margin-left:3px;
					position:absolute;
					padding:9px;
					font-size:30px;
					color:#fff;
			}
			
			.sns_share01 ul li i.question {
					position:absolute;
					padding:8px;
					font-size:30px;
					color:#fff;
			}
			
			.sns_share01 ul li i.tw {
					margin-left: 2px;
					position:absolute;
					padding:10px;
					font-size:30px;
					color:#fff;
			}

/*8-1_2. sns share(circle)*/

.sns_share02 {
	/*custom*/
	*
}

	.sns_share02 ul {
		margin:0;
		width:100%;
	}
	
		.sns_share02 ul li {
			float:left;
			width:50%;
			padding:15px;
			/*font*/
			text-align:center;
		}
		
		.sns_share02 ul li.fb {
			background-color:#3864a3;
			/*font*/
			color:#fff;
		}
		
		.sns_share02 ul li.fb:hover {
			background-color:#397dd2;
		}

		.sns_share02 ul li.tw {
			background-color:#5ea9dd;
			/*font*/
			color:#fff;
		}
		
		.sns_share02 ul li.tw:hover {
			background-color:#72d7f6;
		}
			
			.sns_share02 ul li i.fb {
				margin:3px 10px 0 0;
				/*font*/
				font-size:25px;
			}
			
			.sns_share02 ul li i.tw {
				margin:3px 10px 0 0;
				/*font*/
				font-size:25px;
			}

/*8-2. meter*/

.meter01 {
	width:100%;
	background-color:#353e47;
	padding:0;
	-webkit-border-radius: 50px;
	-moz-border-radius:50px;
	border-radius: 50px;
	/*font*/
	color:#adadad;
	/*reset*/
	border:none;
}
	
	.meter01 .inner {
		background-color:#9ace21;
		padding:5px 20px;
		-webkit-border-radius: 50px;
		-moz-border-radius:50px;
		border-radius: 50px;
		/*font*/
		color:#181e22;
		/*reset*/
		border:none;
	}

/*8-3. popup*/

.popup01 {
	position:fixed;
	left: 50%;
	top: 40%;
	background-color:#fff;
	width:50%;
	margin-left: -25%;
	margin-top:-15%;
	border-radius: 5px; 
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px;
	padding:20px;
}

@media (max-width: 900px) {
.popup01 {
	position:fixed;
	left: 5%;
	top: 20%;
	background-color:#fff;
	width:90%;
	border-radius: 5px; 
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px;
	padding:20px;
	margin:0;
}
}