@charset "utf-8";


/** Common **/
.attention { color:#ee0000 !important; font-weight:600 !important; }
.caption { font-size:12px; font-size:12rem; font-weight:normal; }
.note { font-size:11px;	font-size:11rem !important; color:#666 !important; }
h2 img, h3 img, h4 img {
	display:block;
	width:auto;
	height:auto;
	padding:0;
	margin:0 auto 15px;
}
#title h2 {
	width:100%;
	color:#333;
	font-size:20px; font-size:20rem;
	font-weight:600;
	text-align:center;
	padding:5px 0 15px;
}
h3 {
	width:100%;
	height:40px;
	color:#fff;
	font-size:18px; font-size:18rem;
	font-weight:600;
	padding:9px 0 0 15px;
	margin-bottom:15px;
	background:url(../img/bg-h3.gif) repeat-x;
}
h4 {
	width:96%;
	color:#428bca;
	font-size:16px; font-size:16rem;
	font-weight:600;
	margin:0 auto 15px;
}
.ttl-image, .txt-image {
	width:100%;
	height:auto;
	background:none;
	margin:0 auto;
	padding:0;
}
.link-search { margin-bottom:15px; }


ul {
	width:96%;
	margin:0 auto 15px;
}

ul.list1,
ul.list-square,
ul.list-circle,
ul.list-check {
	font-size:14px;	font-size:14rem;
	font-weight:600;
}
ul.list1 li,
ul.list-square li {
	padding:4px 0 4px 20px;
	background:url(../img/ico-square.gif) no-repeat 0 11px;
}
ul.list-check li {
	padding:8px 0 8px 30px;
	background:url(../img/ico-check.gif) no-repeat 0 4px;
	border-bottom:1px dotted #aaa;
}
ul.list-circle li {
	padding:4px 0 4px 20px;
	background:url(../img/ico-circle.png) no-repeat 0 9px;
}


/* box */
.box-attention {
	width:96%;
	padding:15px 10px;
	margin:0 auto;
	background-color:#fffde6;
	border:2px solid #ffa058;
}
.box-attention h4 {
	width:100%;
	font-size:15px; font-size:15rem;
	font-weight:600;
	color:#0090dc;
	text-align:center;
}
.box-attention li {
	font-weight:600;
	padding-top:5px;
	padding-left:20px;
	background:url(../img/list-circle.png) 0 10px no-repeat;
}
.box-attention2 {
	width:656px;
	padding:25px 30px 20px;
	background-color:#fff;
	border:2px solid #cb0101;
}


/** top **/
#top-merit {}
#top-merit #ttl-merit {
	font-size:22px; font-size:22rem;
	font-weight:600;
	text-align:center;
	margin-bottom:5px;
}
#top-merit #ttl-merit-sub {
	width:100%;
	font-size:14px; font-size:14rem;
	font-weight:600;
}
#top-merit h3 {
	height:auto;
	background:none;
	margin:0 0 5px;
	padding:0;
	font-size:24px; font-size:24rem;
	font-weight:600;
	text-align:center;
	line-height:150%;
}
#top-merit p.ttl-sub {
	width:100%;
	padding:5px 0;
	margin-bottom: 0;
	font-size:13px; font-size:13rem;
	font-weight:600;
	text-align:center;
	line-height:140%;
	color:#fff;
}

#top-merit #merit-01 { margin-bottom:30px; }
#top-merit #merit-01 h3 { color:#00a0e9; }
#top-merit #merit-01 p.ttl-sub { background-color:#00a0e9; }
#top-merit #merit-02 { margin-bottom:20px; }
#top-merit #merit-02 h3 { color:#f29100; }
#top-merit #merit-02 p.ttl-sub { background-color:#f29100; }
#top-merit #merit-02 h4 { 
	color:#0090dc;
	font-size:18px; font-size:18rem;
	font-weight:600;
	text-align:center;
	line-height:140%;
	margin-bottom:15px;
}
#top-merit #merit-03 { margin-bottom:20px; }
#top-merit #merit-03 h3 { color:#22ac38; }
#top-merit #merit-03 p.ttl-sub { background-color:#22ac38; }

#top-poricy {
	padding:20px 7px 5px;
	margin-bottom:20px;
	background-color:#fffef0;
	border:3px solid #d2e6b4;
}
#top-poricy h3 {
	height:auto;
	background:none;
	padding:0;
	color:#333;
	font-size:18px; font-size:18rem;
	font-weight:600;
	text-align:center;
	margin-bottom:15px;
}

#top-match { margin-bottom:15px; }
#top-example { margin-bottom:30px; }

#top-voice { margin-bottom:40px; }
#top-voice h3 {
	height:auto;
	background:none;
	padding:0;
	color:#333;	
	font-size:20px; font-size:20rem;
	font-weight:600;
	text-align:center;
	margin-bottom:15px;
}

.link-buttons {}
.link-buttons ul {
	width:100%;
	border-top:1px solid #aaa;
	border-bottom:1px solid #aaa;
}
.link-buttons li {
	width:33.33%;
	float:left;
	border-right:1px solid #aaa;
}
.link-buttons li a {
	display:block;
	width:100%;
	height:110px;
	text-align:center;
	text-indent:0px;
	text-decoration:underline;
	padding:75px 0 0;
	margin:0;
	background:none;
	background-color:#fcfcfc;
	position:relative;
}
.link-buttons li a:after {
	display: block;
	content: "";
	position:absolute;
	top:10px;
	left:50%;
	width:70px;
	height:60px;
	margin:0 0 0 -35px;
	-moz-background-size:70px 60px;
	background-size:70px 60px;
}
.link-buttons li a.button-price:after { background-image:url(../img/ico-price.png); }
.link-buttons li a.button-start:after { background-image:url(../img/ico-start.png); }
.link-buttons li a.button-faq:after { background-image:url(../img/ico-faq.png); }


/** price **/
#price { margin-bottom:20px; }
#price h4 { text-align:center; }
#price p.ttl {
	font-weight:600;
	font-size:15px; font-size:15rem;
	margin-bottom:0;
}
table.table-price {
	width:96%;
	margin:0 auto 20px;
}
table.table-price th {
	width:50%;
	padding:10px 10px;
	color:#fff;
	font-size:13px; font-size:13rem;
	font-weight:600;
	text-align:left;
	background-color:#cb0101;
	border-bottom:1px solid #eee;
}
table.table-price td {
	font-size:14px; font-size:14rem;
	font-weight:600;
	color:#e60012;
	text-align:center;
	padding:10px 10px;
	border-right:1px solid #ccc;
	border-top:1px solid #ccc; 
	border-bottom:1px solid #ccc;
}

#price-compare { margin-bottom:20px; }
#price-merit { margin-bottom:30px; }
#price-payment { margin-bottom:30px; }


/** start **/
#start-flow { margin-bottom:30px; }
.box-step {
	width:96%;
	margin:0 auto;
	padding:15px 5px 5px;
	border:2px solid #f9cb80;
	background-image:url(../img/bg-grid.gif );
}
#start-flow h4 {
	width:96%;
	min-height:50px;
	font-size:16px;	font-size:16rem;
	font-weight:600;
	padding-left:60px;
	margin:0 auto;
	-moz-background-size:50px;
	background-size:50px;
	background-repeat:no-repeat;	
}
h4.num-01 { background-image:url(../img/start/num-01.gif); padding-top:12px; }
h4.num-02 { background-image:url(../img/start/num-02.gif); padding-top:12px; }
h4.num-03 { background-image:url(../img/start/num-03.gif); padding-top:12px; }
h4.num-04 { background-image:url(../img/start/num-04.gif); padding-top:12px; }
h4.num-05 { background-image:url(../img/start/num-05.gif); padding-top:12px; }
h4.num-06 { background-image:url(../img/start/num-06.gif); padding-top:12px; }
p.onepoint {
	font-weight:600 !important;
	color:#5abe00 !important;
	margin-bottom:0;
}

#about-trial ul { padding-left:20px; }
#about-trial li {
	font-weight:600;
	list-style-type: decimal;
	margin-bottom:10px;
}


/** benefit **/
#benefit { margin-bottom:30px; }
#benefit-teacher { margin-bottom:30px; }
#benefit-01 {
	margin-bottom:20px;
}
.box-benefit {
	width:96%;
	padding:15px 5px 5px;
	margin:0 auto 15px;
	background-color:#fffde6;
	border:2px solid #f9cb80;
}
h4.benefit-h4 {
	width:96%;
	min-height:50px;
	font-size:16px;	font-size:16rem;
	font-weight:600;
	padding-left:60px;
	margin:0 auto;
	-moz-background-size:50px;
	background-size:50px;
	background-repeat:no-repeat;	
}
h4.benefit-02 { background-image:url(../img/benefit/benefit-02.gif); }
h4.benefit-03 { background-image:url(../img/benefit/benefit-03.gif); }
h4.benefit-04 { background-image:url(../img/benefit/benefit-04.gif); }
h4.benefit-05 { background-image:url(../img/benefit/benefit-05.gif); }
h4.benefit-06 { background-image:url(../img/benefit/benefit-06.gif); padding-top:12px; }


/** faq **/
#faq-list { margin:0 auto 30px; }
.box-faq-list {
	width:96%;
	margin:0 auto 15px;
	border:2px solid #cb0101;
}
.box-faq-list h4 {
	width:100%;
	padding:3px 0;
	margin:0;
	color:#fff;
	font-size:16px; font-size:16rem;
	font-weight:600;
	text-align:center;
	background-color:#cb0101;
}
.box-faq-list ul {
	margin:10px auto 15px;
}
.box-faq-list li {
	padding-top:5px;
	padding-left:20px;
	margin-bottom:10px;
	background:url(../img/menu-arrow.png) 3px 12px no-repeat;
	-moz-background-size:10px;
	background-size:10px;
}

#faq-detail { margin-bottom:40px; }
.box-faq {
	width:96%;
	padding-bottom:15px;
	margin:20px auto;
	border-bottom:1px solid #bbb;
}
.box-faq p,
.box-faq h4,
.box-faq ul {
	padding-left:50px;
	margin-bottom:0;
	-moz-background-size:32px;
	background-size:32px;
	background-repeat:no-repeat;
	background-position:0 0;
}
.box-faq h4.question {
	min-height:48px;
	font-size:14px;	font-size:14rem;
	font-weight:600;
	color:#0090dc;
	padding:0 0 10px 50px;
	margin-bottom:15px;
	background-image:url(../img/faq/ico-q.gif);
	border-bottom:1px dotted #aaa;
}
.box-faq p.answer {
	min-height:48px;
	padding:0 0 10px 50px;
	background-image:url(../img/faq/ico-a.gif);
}


/** company **/
table.table-company {
	width:96%;
	margin:0 auto 40px;
}
table.table-company th {
	width:30%;
	padding:10px 10px;
	color:#fff;
	font-size:12px; font-size:12rem;
	font-weight:600;
	text-align:left;
	background-color:#cb0101;
	border-bottom:1px solid #eee;
}
table.table-company td {
	padding:10px 10px;
	border-right:1px solid #ccc;
	border-top:1px solid #ccc; 
	border-bottom:1px solid #ccc;
}


/** privacy agreement **/
#privacy, #agreement { margin-bottom:40px; }
#privacy h4,
#agreement h4 {
	color:#0090dc;
	font-size:16px; font-size:16rem;
	font-weight:600;
}
#privacy ul,
#agreement ul {
	padding-left:20px;
	margin-bottom:20px;
}
#privacy li,
#agreement li {
	list-style-type: decimal;
	margin-bottom:10px;
}


/** voice **/
#blog-list { margin-bottom:20px; }
#blog-article { margin-bottom:30px; }
#blog-list li {
	width:96%;
	min-height:60px;
	padding:10px 0;
	margin:0 auto;
	border-bottom:1px dotted #aaa;
}
#blog-list li:after { content:""; display:block; clear:both; height:0; }
#blog-list li { *zoom: 1; }

#blog-list li p { margin-bottom:5px; }
#blog-list li .blog-thumbnail {
	display:block;
	width:60px;
	height:60px;
	float: left;
	margin-right:15px;
	border:1px solid #ccc;
}
#blog-list li .blog-title {
	font-size: 15px; font-size:15rem;
	font-weight:600;
	color:#333;
}
#blog-list li .blog-title a { color:#333; }
#blog-list li .date {
	font-size:10px;	font-size:10rem;
	color:#777;
}

.box-voice {
	width:96%;
	padding:15px 10px 0;
	margin:0 auto 15px;
	background-color:#fffef0;
	border:1px solid #d1c0a5;
	box-shadow: 1px 1px 8px rgba(0,0,0,0.4);
    -moz-box-shadow: 1px 1px 8px rgba(0,0,0,0.4);
    -webkit-box-shadow: 1px 1px 8px rgba(0,0,0,0.4);
}
.box-voice .ttl-date {
	font-size:16px; font-size:16rem;
	font-weight:600;
	color:#428bca;
}


/** pagination **/
.pagination {
	text-align: center;
}
.pagination ul {
	width:auto;
    display: inline-block;
    /display: block;
    /zoom: 1;
    padding: 0;
}
.pagination li {
    float:left;
	font-size:13px;	font-size:13rem;
	height:28px;
	margin-right:5px;
    list-style:none;
	line-height:2.0em;
}
.pagination a,
.pagination a:link {
	display:block;
	color:#428bca;
	font-size:13px;	font-size:13rem;
	height:28px;
	padding:0 8px;
	text-align:center;
	background-color:#fff;
	border:1px solid #428bca;
	text-decoration:none;	
}
.pagination a.num {
	background-color:#fff;
}
.pagination a.curt,
.pagination a:hover,
.pagination a:active {
	color:#fff;
	text-decoration:none;
	background-color:#428bca;
	border:1px solid #428bca;
}
.pagination li.curt {
	width:28px;
	color:#fff;
	text-decoration:none;
	background-color:#428bca;
}


/** アンケート **/
#questionnaire {
	margin-top:10px;
	margin-bottom:40px;
}
.questionnaire-img img {
	width:96%;
	margin:0 auto 20px;
	border:1px solid #ccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}


.block-letter * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.text-letter {
	width:96%;
	margin:0 auto 40px;
	padding:15px;
	border:1px solid #aaa;
	box-shadow: 5px 5px rgba(0,0,0,0.2);
}
.text-letter p.lt-question {
	color:#eb6100 !important;
	font-weight:bold;
	padding-top:8px;
	padding-left:20px;
	margin-bottom:7px !important;
	background-image: url(../img/ico-circle.png);
	background-repeat: no-repeat;
	background-position: 0 12px;
}
.text-letter p.lt-answer {
	padding-bottom:18px;
	padding-left:20px;
	margin-bottom:8px !important;
	border-bottom:1px solid #aaa;	
}
.text-letter p.lt-answer:last-child {
	padding-bottom:0;
	border:none;
}

/** 追加　ボタン **/
.button-simple {
	position: relative;
	font-weight: bold;
	line-height:1.3em;
	width:95%;
	padding: 10px 20px;
	margin: 0px 5px;
	border-radius: 30px;/*角の丸み*/
	font-size: 2.1em;/*文字サイズ*/
	background-color: #00a41a;/*背景色*/
	color: #fff;/*文字色*/
	display: inline-block;
	text-shadow: 1px 1px 0px rgb(0, 0, 0, 0.3);
	box-shadow: 0 3px 0 rgb(0, 0, 0, 0.3);
}
.button-simple:before {
	font-family: FontAwesome;
	content: '\f144';/*好きなアイコン*/
	color: #eeee22;/*アイコンの色*/
	margin-right: 3px;
}
a:hover .button-simple {
	background-color: #cc0000;/*触れたときの背景色*/
	color: #fff;/*触れたときの文字色*/
	box-shadow: 0 0px 0 rgb(0, 0, 0, 0.3);
	animation-play-state: paused;
	top: 3px;
}


.button-simpleor {
	position: relative;
	font-weight: bold;
	line-height:1.3em;
	padding: 10px 20px;
	width:95%;
	margin: 0px 5px;
	border-radius: 25px;/*角の丸み*/
	font-size: 2.1em;/*文字サイズ*/
	background-color: #FF8506;/*背景色*/
	color: #fff;/*文字色*/
	display: inline-block;
	text-shadow: 1px 1px 0px rgb(0, 0, 0, 0.3);
	box-shadow: 0 3px 0 rgb(0, 0, 0, 0.3);
}
.button-simpleor:before {
	font-family: FontAwesome;
	content: '\f144';/*好きなアイコン*/
	color: #eeee22;/*アイコンの色*/
	margin-right: 3px;
}
a:hover .button-simpleor {
	background-color: #cc0000;/*触れたときの背景色*/
	color: #fff;/*触れたときの文字色*/
	box-shadow: 0 0px 0 rgb(0, 0, 0, 0.3);
	animation-play-state: paused;
	top: 3px;
}


.button-simplebl {
	position: relative;
	font-weight: bold;
	line-height:1.3em;
	padding: 10px 20px;
	width:95%;
	margin: 0px 5px;
	border-radius: 25px;/*角の丸み*/
	font-size: 2.1em;/*文字サイズ*/
	background-color: #00A0E9;/*背景色*/
	color: #fff;/*文字色*/
	display: inline-block;
	text-shadow: 1px 1px 0px rgb(0, 0, 0, 0.3);
	box-shadow: 0 3px 0 rgb(0, 0, 0, 0.3);
}
.button-simplebl:before {
	font-family: FontAwesome;
	content: '\f144';/*好きなアイコン*/
	color: #eeee22;/*アイコンの色*/
	margin-right: 3px;
}
a:hover .button-simplebl {
	background-color: #cc0000;/*触れたときの背景色*/
	color: #fff;/*触れたときの文字色*/
	box-shadow: 0 0px 0 rgb(0, 0, 0, 0.3);
	animation-play-state: paused;
	top: 3px;
}

.purupuru {
	animation: purupuru 0.1s infinite;
}
@keyframes purupuru {
	0% {
		transform: translate(0px, 0px)
	}
	50% {
		transform: translate(0px, 1px) rotateZ(1deg)
	}
}
/** 追加　ボタン **/
/** レッスン料金 **/
.button-simplep {
	position: relative;
	font-weight: bold;
	line-height:0.6em;
	width:95%;
	padding: 25px 50px 5px 50px;
	margin: 10px 20px 10px 20px;
	border-radius: 30px;/*角の丸み*/
	font-size: 3.0em;/*文字サイズ*/
	background-color: #00a41a;/*背景色*/
	color: #fff;/*文字色*/
	display: inline-block;
	text-shadow: 1px 1px 0px rgb(0, 0, 0, 0.3);
	box-shadow: 0 3px 0 rgb(0, 0, 0, 0.3);
}
.button-simplep:before {
	font-family: FontAwesome;
	content: '\f144';/*好きなアイコン*/
	color: #eeee22;/*アイコンの色*/
	margin-right: 3px;
}
/** レッスン料金 **/

