@charset "UTF-8";

/****************************************

		Reset & Setting

*****************************************/

body {
	margin: 0;
	padding: 0;
	background:url(../img/remember/bg.jpg);
	color:#FFF
}


div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,th,td { 
	margin:0;
	padding:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

fieldset,img { 
	border:0;
}

address,caption,cite,code,dfn,em,th,var {
	font-style:normal;
	font-weight:normal;
}

ol,ul {
	list-style:none;
}

caption,th {
	text-align:left;
}

h1,h2,h3,h4,h5,h6 {
	font-weight:normal;
}

q:before,q:after {
	content:'';
}

abbr,acronym { border:0;
}

a {
	outline: none;
	text-decoration:none;
	color:#FFF;
}
a:hover {text-decoration: underline;}

iframe {
	border: none;
}

span.skype_pnh_print_container{display:inline !important;}
span.skype_pnh_container{display:none !important;}


.mt0 { margin-top:0px !important; }
.mt15 { margin-top:15px !important; }
.mt50 { margin-top:50px !important; }
.mb50{ margin-bottom:50px !important; }

.alph a:hover img,
.alph input:hover{filter: alpha(opacity=60); -moz-opacity:0.6; opacity:0.6;}


.fl	{ float:left; }
.fr	{ float:right; }
.cb	{ clear:both; }

.tl	{ text-align:left; }
.tc	{ text-align:center; }
.tr	{ text-align:right; }

.small{ font-size:10px;}


.pagetop {
	width: 960px;
	margin: 30px auto 50px auto;
	z-index: 1000;
	text-align: right;
	position: relative;
}




/****************************************

		base

*****************************************/

body {
}

#container {
	color: #FFF;
	width: 1000px;
	line-height: 1.3;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	
}


/****************************************

		header

*****************************************/

#header {
width: 100%;
/*background: url(../img/ar/title_header_bg.jpg) repeat-x;
background-position:bottom;*/
background:#66C4D0;
position: fixed;
/*height: 88px;
top: -88px;*/
height: 73px;
top: -73px;
z-index: 4000;
}

#header .header_wrap {
width: 960px;
margin: 0 auto 0 auto;
}

#header .header_wrap_l {
width: 573px;
overflow: hidden;
float: left;
}

#header .header_wrap_l .logo {
/*margin-top:12px;*/
margin-top:5px;
}
	
#header .header_wrap_r {
width: 370px;
position: relative;
padding: 0;
float: left;
}
	
#header .header_wrap_r .sns {
float: right;
width: 130px;
margin: 0px 0 0 0px;
}
		
#header .header_wrap_r .sns li{
/*margin: 12px 0 0 12px;*/
margin: 5px 0 0 12px;
}
	
#header .header_wrap_r .sns li.tit{
float: none;

line-height: 0;
}
/*---------------------------------------------------------*/

#header2 {
width: 100%;
/*background:url(../img/project/headerbg.png) top;*/
background:#66C4D0;
position: fixed;
/*height: 88px;
top: -88px;*/
height: 73px;
top: 0px;
z-index: 4000;
}

#header2 .header_wrap {
width: 960px;
margin: 0 auto 0 auto;
}

#header2 .header_wrap_l {
width: 573px;
overflow: hidden;
float: left;
}

#header2 .header_wrap_l .logo {
/*margin-top:12px;*/
margin-top:5px;
}
	
#header2 .header_wrap_r {
width: 370px;
padding: 0;
float: right;
}
	
#header2 .header_wrap_r .sns {
float: right;
margin: 16px 0 0 37px;
}
		
#header2 .header_wrap_r .sns li{
float: left;
/*margin: 12px 0 0 12px;*/
margin: 5px 0 0 12px;
}
	
#header2 .header_wrap_r .sns li.tit{
float: none;
margin: 0 33px 6px 12px;
line-height: 0;
}




/****************************************

		main

*****************************************/

#container {
	/*margin-top:80px;*/
	width: 100%;
}


#container #main_con {
width: 960px;
margin: 0 auto 0 auto;
/*background-position: 0 10px;*/
}

#main_con .mainImg {
height: 321px;
margin: 0;
padding: 0;
position: relative;
}
	
#main_con .mainImg .title {

}

#main_con .mainImg .title_txt {
top:72px;
left:0;
position:absolute;
}
	
/*#main_con .mainImg .txt_wrap {
width:157px;
top:140px;
left:14px;
position:absolute;	
}*/
#main_con .mainImg .txt_wrap {
width:160px;
top:152px;
left:5px;
position:absolute;	
}
		
#main_con .mainImg .txt_wrap .txt {
	
}

#main_con .mainImg .main_wrap {
width:796px;
z-index: 1000;
position:absolute;
/*right:0;*/
right:5px;
/*top:107px;*/	
top:142px;
}

/*#main_con .mainImg .main_wrap {
width:810px;
z-index: 1000;
position:absolute;
right:0;
top:140px;
}*/

#main_con .mainImg .special_wrap {
width:960px;
z-index: 1000;
position:absolute;
left:0;
/*top:107px;*/	
top:465px;
}
		
#main_con .download_wrap {
/*margin-top:92px;*/
/*margin-top:110px;*/
margin-top:230px;
position: relative;
height:320px;
}
	

#main_con .download_wrap .img {
top: 50px;
left: 0px;
width: 310px;
position: absolute;
}
				
#main_con .download_wrap .img .icon {
margin: 0;}		
				
#main_con .download_wrap .download {
top: 65px;
right: 0px;
width: 626px;
position: absolute;
}

#main_con .download_wrap .download li {
margin: 25px 0 0 0;
line-height: 0;
}
				
#main_con .download_wrap .download .btn li {
float: left;
margin: 27px 20px 29px 0;}			
	
#main_con .AppHow {
position: relative;
margin-top:40px;
}
	
#main_con .AppHow .img {
padding: 0px 0 0 0;
}

.app_wrap{ background-color:#132b4e;}
		
#main_con .AppHow .step_box {
overflow: hidden;
}

#main_con .AppHow .step {
/*width: 441px;*/
margin: 10px 0 0 16px;
float: left;
}
#main_con .AppHow .txt {
margin: 10px 0 0 0;
padding:15px;
}

#main_con .box_bottom {
height: 50px;}

#main_con .qa_wrap {}

.title {
	text-align:center
}
		
#main_con .qa_wrap .qa {
background: #FFF url(../img/ar/qa_bg.jpg) no-repeat center bottom;
margin: 0 50px 0px 50px;
padding:50px;
margin-bottom:15px;
color: #666;
overflow: hidden;
font-size:0.9em;
line-height:150%;
border:#66C4D0 solid 5px;
}
		
#main_con .qa_wrap .qa .q {
background: url(../img/ar/qa_ico_q.gif) no-repeat;
background-position: 0 28px;
width: 254px;
margin-right:10px;
text-shadow: 2px 2px 3px #999;
padding: 39px 8px 40px 60px;
font: 14px/1.9 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
float: left;
color:#000;
}

#main_con .qa_wrap .qa .a {
background: url(../img/ar/qa_ico_a.gif) no-repeat;
background-position: 0 28px;
width: 506px;
padding: 39px 0 40px 60px;
font: 13px/1.8 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
float: left;
/*color:#d19b17;*/
}


/******************************************/

.tube { float:left; margin:5px; width:466px; border:#000 solid 2px;}


.tube embed{z-index:100;}


.jk {float:left; margin-right:20px;}
.imgsample {
	margin-top:20px;
	border-top: #CCC dotted 1px; padding-top:15px;
	/*border-bottom: #CCC solid 1px; padding-bottom:20px;*/
}
.imgsampleitem { float:left; width:29%; margin:0 2%;}
.imgsampleitem img { width:100%;}

/*#goodslink {
list-style: none;
    margin: 0 auto 25px;
    padding: 0;
    background: #fff;
    border-radius: 8px;
    border: 2px solid #ccc;
}
*/
#goodslink ul{
    list-style: none;
    margin: 0 auto 25px;
    padding: 0;
    background: #fff;
    border-radius: 8px;
    border: 2px solid #ccc;
}

#goodslink ul li{
    margin: 0;
	display:block;
	height:35px;
	line-height:35px;
	
}

#goodslink ul li:first-child{
    -webkit-border-top-left-radius: 8px;  
    -webkit-border-top-right-radius: 8px;  
    -moz-border-radius-topleft: 8px;  
    -moz-border-radius-topright: 8px;  
}

#goodslink ul li:last-child{
    -webkit-border-bottom-right-radius: 8px;  
    -webkit-border-bottom-left-radius: 8px;  
    -moz-border-radius-bottomright: 8px;  
    -moz-border-radius-bottomleft: 8px;  
}

#goodslink ul li.odd { background:#f1f1f1}

#goodslink ul li a {
	display:block;
	padding: 0 0 0 40px;
	background:url(../img/remember/cart.png) no-repeat left center;
	color:#000;
}

/*#goodslink ul li a:hover {color:#F06;}*/

#goodslink ul li:first-child a {
	-webkit-border-top-left-radius: 8px;  
    -webkit-border-top-right-radius: 8px;  
    -moz-border-radius-topleft: 8px;  
    -moz-border-radius-topright: 8px;  
}

#goodslink ul li:last-child a {
	-webkit-border-bottom-right-radius: 8px;  
    -webkit-border-bottom-left-radius: 8px;  
    -moz-border-radius-bottomright: 8px;  
    -moz-border-radius-bottomleft: 8px; 
}


#goodslink ul li a:hover {
	/*background:#0CC url(../img/remember/cart.png) no-repeat left center;	*/
}
/*#goodslink ul li:hover {background:#0CC url(../img/remember/cart.png) no-repeat left center;}*/

a.linkbtn {
	/*background: -moz-linear-gradient(top,#0e0e0e 0%,#7d7e7d);
	background: -webkit-gradient(linear, left top, left bottom, from(#0e0e0e), to(#7d7e7d));*/
	background:#3CF;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	color:#FFF;
	-moz-box-shadow: inset 1px 1px 1px rgba(000,000,000,0.3);
	-webkit-box-shadow: inset 1px 1px 1px rgba(000,000,000,0.3);
	text-decoration:none;
	padding: 10px 0;	
}

a:hover.linkbtn{
	background:#8be0fc;
	text-decoration:none;
}

.accordion_head {
	cursor:pointer;
	text-align:center;
	margin-bottom:20px;
	font-weight:bold;
	font-size:larger;
}

/****************************************

		footer

*****************************************/



#footer {
	width: 100%;
	height: 35px;
	padding: 20px 0 0 0;
	position: relative;
	background-color:#66C4D0;
}

#footer_txt {
	width:958px;
	height:36px;
	margin: 0 auto 0 auto;
	text-align:center;
	font-size:11px;
	color:#FF0;
}
.photofloat { margin-bottom:0;}
.photofloat img { width:370px;}

.box {
	width:32%;
	margin:0 1% 1% 0;
  background: #f8f8f8;
  line-height: 1.4em;
  float: left;
  -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
          border-radius: 5px;
}
.box div { padding:15px;}
.box h2 {
  font-size: 14px;
  font-weight: 200;
}

.box img,
#tumblelog img {
  display: block;
  width: 100%;
}


.block { margin-bottom:20px;} 

@media screen and (max-width: 959px){
   	html, body {
	 -webkit-text-size-adjust: 100%;

	}
	#header { top: 0px;}
	#container {width:100%; margin-top:75px;}
	#container #main_con {
		width:100%;
		margin:auto;
	}
	#header .header_wrap {width:95%;margin:auto;}
	#header .header_wrap_l{ width:100%}
	#header .header_wrap_r{ width:100%; display:none;}
	#main_con .mainImg .main_wrap {width:95%; padding:3%; margin:auto}
	.titleimg { width:100%;}
	#footer_txt {width:100%;}
	.pagetop {width:100%; margin: 30px auto 50px auto;}
	.photofloat img { float:left; padding-left:5px; margin-bottom:0}
	#main_con .qa_wrap .qa .a { width:50%;}
	#main_con .qa_wrap .qa {margin: 0 2% 0px 2%;padding:2%;}
	.jk { float: none; text-align:center}
}