@charset "utf-8";
/*
Theme Name: ありが10
Theme URI: http://tsukuitomoko.com/
Description:  津久井智子10周年テーマ
Author: Ryoko Kubota
Version: 1.1
License: Ryoko Kubota
License URI: http://www.kubotaryoko.com/
*/

/*--------------- Reset -----------------*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

address{
	font-style:normal;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display:block;
}

ol, ul {
	list-style: none;
}

blockquote, q {
    quotes:none;
}

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

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

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

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

img {
    vertical-align: middle;
    font-size:0;
    line-height: 0;
	border:none;
}

.aligncenter{
	display: block;
	 clear: both;
	margin:0 auto;
	text-align:center;
}

.alignleft{
	float:left;
	margin:0 20px 20px 0;
}

.alignright{
	float:right;
	margin:0 0 20px 20px;
}

/*--------------- Layout -----------------*/

@font-face {
  font-family: 'riit_f';
    src: url('../font/riit_f.eot?') format('eot'), 
         url('../font/riit_f.woff') format('woff'), 
         url('../font/riit_f.ttf')  format('truetype'),
         url('../font/riit_f.svg#svgFontName') format('svg');
    }


html,body{
     height:100%;
}

body{
	font-size:15px;
	line-height:1.5;
	-webkit-text-size-adjust:none;
	color:#333;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

a{
	text-decoration:underline;
	color:#6d1f99;
	outline:none;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}
a:hover{
	text-decoration:none;
	color:#709703;
}

.pagetop{
	position: fixed;
	bottom:20px;
	right:0;
	z-index:100;
}

.ameblolink{
	font-size:14px;
}

.ameblolink li{
	margin:0 0 10px 0;
}

/*--------------- Area -----------------*/
.row{
	width:100%;
	max-width:960px;
	margin:0 auto;
	overflow:hidden;
}

#official{
	position:absolute;
	left:10px;
	top:10px;
	font-size:12px;
}

#official a{
	color:#333;
	text-decoration:none;
}

header,
#checkpoint{
	padding:0 0 30px 0;
}

#join,
#anv,
#contact,
#info{
	padding:30px 0;
}

header,
#checkpoint,
#info,
#anv{
	background:url("../img/bg_red.png");
}

nav,
footer{
	background:url("../img/bg_purple.png");
}

body,
#about,
#join{
	background:url("../img/bg_white.jpg");
}

#border{
	background:url("../img/noshi.png") no-repeat top center;
	padding:90px 0 0 0;
}

nav{
	overflow:hidden;
}

nav ul{
	border-left:1px solid #fff;
}

nav ul li{
	float:left;
	text-align:center;
	border-right:1px solid #fff;
	width:19.8%;
	font-size:18px;
}

nav ul li a{
	display:block;
	padding:2% 4% 0 16%;
	background:url("../img/ico_gnavi.png") no-repeat 4% 23%;
}

nav ul li a:link,
nav ul li a:visited{
	color:#fff;
	text-decoration:none;
}

nav ul li a:hover{
	background:#603276 url("../img/ico_gnavi.png") no-repeat 4% 15%;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}

footer p{
	text-align:center;
	color:#fff;
	padding:10px 0;
}

/*--------------- Font -----------------*/

nav,h1.check-heading01,h2,h3,h4,#message,#contact,footer,.checkpoint-list span,#step03-area dl,.check-cat,#hanko-form,#jyubako-form{
  font-family: 'riit_f';
  font-weight:normal;
}

#contact dd{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/*--------------- Heading -----------------*/

h2,
h1.check-heading01{
	font-size:30px;
	color:#3e560c;
	text-align:center;
	margin:0 0 30px 0;
}

h1.check-heading01{
	font-size:23px;
	margin:0 0 10px 0;
}

h3{
	font-size:27px;
	margin:23px 0 0 0;
	padding:20px 0 30px 100px;
}

h2.check-heading02,
h2.check-heading03{
	font-size:20px;
	color:#993366;
	margin:0 0 20px 0;
}

h2.check-heading03{
	color:#333;
}

h4{
	text-align:center;
	font-size:23px;
	margin:0 0 20px 0;
}

/*-- Info --*/

#info-area{
	overflow:auto;
	height:200px;
}

/*-- About --*/

#about{
	padding:30px 0 0 0;
}

#about h2 span{
	background:url("../img/img_book.png") no-repeat left;
	padding:10px 0 20px 80px;
}

#about p{
	text-align:center;
}

.share-area{
	background:#fff;
	border:2px solid #ccc;
	-webkit-border-radius:7px;
	-moz-border-radius:7px;
	-border-radius:7px;
	padding:1% 3%;
	margin:20px 0;
	font-size:20px;
	overflow:hidden;
}

.share-area p{
	float:left;
	padding:0 2% 0 0;
	font-family: 'riit_f';
}

.share-area p.normal{
	float:none;
	padding:0;
	text-align:center;
	margin:0 0 10px 0;
}

.share-area p.normal.font-s{
	font-size:14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#mform{
	font-size:13px;
	text-align:center;
	font-family: 'riit_f';
}

#mform input{
	cursor:pointer;
}

#mform .board01{
	height:22px;
	width:200px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:2px solid #ccc;
}

.wp_social_bookmarking_light{
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}
.wp_social_bookmarking_light div{
    float: left !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 5px 0px 0 !important;
    height: 23px !important;
    text-indent: 0 !important;
}
.wp_social_bookmarking_light img{
    border: 0 !important;
    padding: 0;
    margin: 0;
    vertical-align: top !important;
}
.wp_social_bookmarking_light_clear{
    clear: both !important;
}
.wsbl_twitter{
    width: 100px;
}

#message{
	background:url("../img/bg_message.png") no-repeat center;
	text-align:center;
	padding:115px 0 65px 0;
}

#message p.signiture{
	font-size:22px;
}

#message h2{
	margin:10px 0 0 0;
	font-size:25px;
}

/*-- Join --*/

#join h2{
	line-height:2.5;
	margin:0 0 10px 0;
}

#join h2 span{
	background:url("../img/img_join.png") no-repeat left;
	padding:20px 0 20px 110px;
}

#step01 h3{
	background:url("../img/ico_step1.png") no-repeat left top;
}

#step02 h3{
	background:url("../img/ico_step2.png") no-repeat left top;
}

#step03 h3{
	background:url("../img/ico_step3.png") no-repeat left top;
}

#stepgoal h3{
	background:url("../img/img_goal.png") no-repeat left top;
}

#step01,
#step02,
#step03{
	background:url("../img/arrow_step.png") no-repeat 3% bottom;
}

#step01 p,
#step02 p,
#step03 p{
	padding:0 0 0 100px;
}

#step01 #step01-area p{
	padding:0 0 0 240px;
}

.font-b{
	font-size:20px;
	font-family: 'riit_f';
}

#step04-area p{
	padding:0 0 0 360px;
}

#step01-area{
	background:url("../img/img_hankobook.png") no-repeat 13% 0;
	padding:30px 0 60px 0;
	margin:20px 0;
}

#step02-area{
	background:url("../img/img_around.png") no-repeat right;
	padding:0 0 65px 0;
}

#step03-area{
	background:url("../img/img_gallery.png") no-repeat 23% 0;
	padding:60px 0;
	margin:20px 0 0 0;
}

#step04-area{
	background:url("../img/img_get.png") no-repeat 13% 0;
	padding:60px 0;
}

#step03-area dl{
	text-align:right;
}

#step03-area dt{
	font-size:20px;
}

#step03-area dd{
	font-size:17px;
}

.checkpoint-list{
	text-align:center;
	font-size:22px;
	margin:30px 0 0 0;
}

.checkpoint-list li a{
	color:#fff;
	background:url("../img/bg_purple.png");
	text-decoration:none;
	padding:10px 20px;
}

.checkpoint-list li a:hover{
	background:#603276;
}

#present-area{
	background:#fff url("../img/img_present.png") no-repeat 2% 40%;
	padding:20px 20px 20px 12%;
	width:65%;
	margin:20px auto;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:2px solid #ccc;
}

/*-- Check Point --*/

#checkpoint h2{
	line-height:4;
}

#checkpoint h2 span{
	background:url("../img/img_checkpoint.png") no-repeat left;
	padding:40px 0 50px 140px;
}

.check-area{
	background:url("../img/bg_chekpoint.png") no-repeat center;
}

.check-list{
	overflow:hidden;
	margin:20px 0;
}

.check-list li{
	float:left;
	margin:0 1% 25px 0;
	width:32%;
	overflow:hidden;
	font-size:13px;
}

.check-list li a{
	color:#333;
	text-decoration:none;
}

.check-list li figure{
	float:left;
	margin:0 10px 0 0;
}

.check-cat{
	text-align:center;
	font-size:16px;
	margin:0 0 20px 0;
}

#check-img{
	text-align:center;
	margin:0 0 20px 0;
}

.check-block{
	margin:0 0 20px 0;
	padding:20px 3%;
}

#tsukui{
	text-align:center;
}

.check-comment{
	background:url("../img/bg_red.png");
	padding:20px 3%;
	margin:0 0 20px 0;
}

.accept-btn{
	text-align:center;
	padding:0 0 20px 0;
}

/*-- jyubako --*/

#jyubako h2{
	line-height:4;
	margin:0 0 10px 0;
}

#jyubako h2 span{
	background:url("../img/img_ojyu.png") no-repeat left;
	padding:50px 0 50px 100px;
}

.ojyu-list{
	float:right;
	width:75%;
	margin:10px 0 0 0;
}

.ojyu-list li{
	list-style:disc;
}

/*-- Anv --*/

.anv-img{
	width:35%;
}

/*-- Contact --*/

.contact-bg{
	border:dashed 2px #ccc;
	padding:10px;
	margin:0 0 40px 0;
}

.inquiry-list{
	overflow:hidden;
	margin:0 auto;
	width:70%;
}

.inquiry-list dt{
	float:left;
	width:13em;
	margin:0 0 10px 0;
}

.inquiry-list label{
	display:block;
	cursor:pointer;
}

.inquiry-list dd{
	margin:0 0 10px 13em;
}

#contact p{
	text-align:center;
	margin:20px 0;
}

.textarea01 input{
	height:22px;
	width:80%;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:2px solid #ccc;
}

.textarea02 input{
	height:22px;
	width:20%;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:2px solid #ccc;
}

.form-text-area textarea{
	height:200px;
	width:80%;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	border:2px solid #ccc;
}

.btn-area,
.wpcf7-response-output{
	text-align:center;
}

.btn-area input{
	width:20%;
	cursor:pointer;
}

div.wpcf7-validation-errors{
	border:none!important;
}

/*--------------- responsive img -----------------*/

header img,
img.alignleft{
	width: auto;
	max-width: 100%;
	height: auto;
}

/* iPad Smaller than 961px ----------- */
@media only screen and (max-width : 959px) {

.pagetop{
	right: 0;
	bottom:0;
}

nav ul{
	border-left:none;
}

nav ul li{
	float:none;
	border-bottom:1px solid #fff;
	width:auto;
}

nav ul li a{
	padding:1% 4% 1% 0;
	background:url("../img/ico_gnavi.png") no-repeat 2% 50%;
	min-height:inherit;
}

nav ul li a:hover{
	background:#603276 url("../img/ico_gnavi.png") no-repeat 5% 50%;
	border-radius:0px;
	-webkit-border-radius:0px;
	-moz-border-radius:0px;
}

#about,
#jyubako,
#info{
	padding:30px 20px 0 20px;
}

#checkpoint{
	padding:0 20px 30px 20px;
}

#join,
#anv,
#contact{
	padding:30px 20px;
}

#message{
	padding: 115px 20px 65px 20px;
}

#step02-area {
    background-position:bottom;
    padding: 0 0 175px 0;
}

#step03-area {
    background-position:center top;
    padding: 220px 0 0 0;
}

#step03-area dl {
    text-align:center;
}

#present-area{
	width:auto;
	padding: 20px 20px 20px 14%;
}

.check-list li{
	float:none;
	width:auto;
}

.alignleft,
.alignright {
    float: none;
    margin: 0 0 20px 0;
}

.anv-img{
	text-align:center;
	width:auto;
}

.ojyu-list{
	float:none;
	width:auto;
	margin:10px 0 0 1.2em;
}


}

/* =Responsive Mobile (landscape)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {

#about{
	padding:30px 10px 0 10px;
}

#checkpoint{
	padding:0 10px 30px 10px;
}

#checkpoint p{
	margin:100px 0 0 0;
}

#join,
#anv,
#contact{
	padding:30px 10px;
}


#join h2,
#jyubako h2 {
	line-height:1.5;	
}

#join h2 span,
#jyubako h2 span {
    padding: 50px 0 50px 110px;
	display:block;
}

#step01 h3,
#step02 h3,
#step03 h3,
#stepgoal h3 {
    background-position:center top;
}


#step01, #step02, #step03 {
    background:none;
}

#step01 p, #step02 p, #step03 p {
    padding: 0;
}

#step01-area{
    background-position:center top;
    padding: 140px 0 0 0;
}

#step01 #step01-area p {
    padding:0;
	text-align:center;
}

#step02-area{
    background-position:center top;
    padding:200px 0 0 0;
}

#step03-area{
    background-position:center top;
	background-size:contain;
    padding: 160px 0 0 0;
}

#step04-area{
    background-position:center top;
    padding: 220px 0 0 0;
}

#present-area{
    background-position:center 2%;
    padding: 60px 0 0 0;
}

#step04-area p{
	padding:0;
}

#present-area p{
	padding:20px;
}

#checkpoint h2 {
    line-height:1.5;
}

#checkpoint h2 span {
    padding: 10px 0 90px 140px;
}

h3 {
    padding: 100px 0 30px 0;
	text-align:center;
}

#about p{
	text-align:left;
}

.share-area p{
	float:none;
	padding:0;
	text-align:center;
}

#message{
	padding:120px 10px 0 10px;
	background:url("../img/img_tomoko.png") no-repeat center top;
	text-align:left;
}

#message p.signiture{
	text-align:center;
}


.inquiry-list {
    width:auto;
}

.inquiry-list dt {
    float:none;
    width:auto;
}


.inquiry-list dd {
    margin: 0 0 10px 0;
}

.textarea01 input,
.form-text-area textarea{
	width:97%;
}


.textarea02 input{
	width:27%;
}


.check-list li.check-list{
	width:auto;
}

.check-area{
	background-size:contain;
}

#step03-area dl {
	margin:80px 0 0 0;
}


h2,h3{
	font-size:22px;
}

.checkpoint-list{
	font-size:16px;
}

#mform span{
	display:block;
	margin:0 0 10px 0;
}

}

/* Smartphones (portrait) ----------- */

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

nav ul li{
	font-size:14px;
}

nav ul li a{
	padding:3% 4% 3% 10%;
}

#about h2 span {
	display:block;
}


#join h2 span {
    padding: 0 0 10px 90px;
	display:block;
}

#checkpoint h2 span {
	padding:10px 0 30px 140px;
	display:block;
}

#checkpoint p{
	margin:20px 0 0 0;
}

#step03-area dl {
	margin:20px 0 0 0;
}

#check-img img{
	max-width: 100%;
	height: auto;
	width :auto;}

}