@charset "utf-8";
/* formatting style
--------------------------*/
* {
  margin: 0;
  padding: 0;
}
body {
	background-color: #FFFFFF;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "MS PGothic", sans-serif;
	margin: 0;
	padding: 0;
	color: #555555;
	font-size: 85%;
	line-height: 1.6;
}
img{
	vertical-align:bottom;
	max-width: 100%;
}
a img {
	border-width: 0px;
}
a:link {
	color: #3e3bc9;
	text-decoration: underline;
}
a:visited {
	color: #929;
	text-decoration: underline;
}
a:hover {
	color: #ff3241;
}
a:active {
	color: #ff3241;
}
.orange {
	font-weight: bold;
	color: #FF6600;
}
.emerald {
	font-weight: bold;
	color: #3DB8B8;
}
.smallsize {
	font-size: 85%;
}

.largesize {
	font-size: 115%;
	text-align: left;
	line-height: 16px;
}

.name_img{
	height: 10px;
	vertical-align: text-top;
}


/* other styles
--------------------------*/
.photo_left,
.pctb_float_left {
	float: left;
	margin-top: 5px;
	margin-right: 15px;
	margin-bottom: 5px;
}
.photo_right,
.pctb_float_right {
	float: right;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 15px;
}

.pc_margin0 {
	margin: 0px !important;
}

html{
   overflow-y:scroll;
}
.rollover {
}

/* モダンブラウザ（Firefox Opera Safari）対策 */
.clearfix:after{
   content:".";
   display:block;
   height:0px;
   clear:both;
   visibility:hidden;
}

/* Win版IE7とMac版IE5対策 */
.clearfix{
   display:inline-block;
}

/* Win版IE5および6対策 */
/* Hides from IE-mac \*/
* html .clearfix{
   height:1px;
}

.clearfix{
   display:block;
}




/* basic layout
--------------------------*/
#container {
	width: 800px;
	border-right: 1px solid #999999;
	border-left: 1px solid #999999;
	background-color: #FFFFFF;
	border-bottom: 1px solid #999999;
	margin: 10px auto;
}

#container address {
	color: #666666;
	font-size: 90%;
}
#header {
	height: 82px;
	padding: 0px;
	margin: 0px;
	line-height: normal;
	background-image: url(header_backimage.gif);
	background-repeat: no-repeat;
}
#header #h1rogo {
	float: left;
	margin-top: 12px;
	margin-left: 17px;
}
#header #h1rogo #rogo {
	margin-top: 5px;
	width: 229px;
}
#header h1 {
	font-size: 10px;
	font-weight: normal;
}
#header #link {
	float: right;
	width: 430px;
	margin-right: 70px;
	height: 28px;
}
#header #link ul li {
	font-size: 10px;
	display: inline;
	line-height: normal;
	background-image: url(yajirushi_small.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-left: 10px;
	margin-right: 10px;
}
#header #link ul {
	width: 400px;
}


#header #link a {
	text-decoration: none;
	color: #555555;
}
header  #link  a:hover  {
	color: #FF2D2D;
}



#header ul {
	margin-right: 4px;
	clear: right;
	float: right;
}
#header ul li {
	list-style: none;
	float: left;
	padding-right: 6px;
	padding-top: 24px;
}
ul#top_banner {
	float: right;
	padding-top: 15px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#header_nabi {
	line-height: 0px;
	margin: 0px;
	padding: 0px;
	background-image: url(header_bar.gif);
	background-repeat: no-repeat;
}
#header_nabi ul {
	height: 22px;
	padding: 10px 0px 3px 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 26px;
}
#header_nabi  ul li {
	font-size: 11px;
	height: 22px;
	float: left;
	list-style: none;
	text-align: center;
	line-height: 0px;
	margin: 0px;
	padding: 0px;
	width: 124px;
}
/*#header_nabi ul li a {
	line-height: normal;
	margin: 0px;
	padding: 0px;
	text-decoration: none;
	color: #336666;
}*/
#header_nabi   ul li a:hover  {
	color: #FF3366;
	text-decoration: none;
}

#header_nabi a:hover img {
    opacity: 0.5; 
    filter: alpha(opacity=50); 
    -moz-opacity: 0.5;
}


ul#top_banner li {
	float: left;
	padding: 0px 10px 0px 0px;
	list-style: none;
	margin: 0px;
}

#pankuzu {
	margin: 0px;
	float: left;
	font-size: 12px;
	width: 350px;
	padding-top: 15px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
}


#contents {
	clear: both;
	padding-top: 10px;
	height: 100%;
}




#main {
	float: right;
	width: 555px;
	margin: 0px;
	padding: 0px 20px 20px;
	display: inline;
}
#main #footer_menu {
	text-align: left;
	margin: 0px;
	padding: 20px 0px 0px;
}

#main  ul#footer_menu li {
	list-style: none;
	display: inline;
	border-right: 1px solid #666666;
	padding-right: 5px;
	padding-left: 5px;
	font-size: 90%;
}
#main ul#footer_button {
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	clear: both;
}
#main   ul#footer_button   li {
	list-style: none;
	display: inline;
}
#main p#toplink {
	font-size: 80%;
	float: right;
}

#main    #top_menu {
	overflow: hidden;
}

#main    #top_menu    .list {
	width: 260px;
	float: left;
	font-size: 95%;
	margin: 10px 0px 25px 12px;
	padding: 0px;
	height: 80px;
}
#main   #top_menu   img   {
	float: left;
	padding-right: 10px;
}
#main  #top_menu  h3  a {
	background-image: url(../images/icon_yajirushi_red.gif);
	background-repeat: no-repeat;
	background-position: left;
	font-size: 95%;
	margin-bottom: 5px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
}



#sidebar {
	float: left;
	width: 200px;
	background-color: #FFECEC;
	margin: 0px 0px auto;
	padding: 0px 0px 100px;
	background-repeat: repeat;
}


#sidebar a:hover img {
    opacity: 0.5; 
    filter: alpha(opacity=50); 
    -moz-opacity: 0.5;
}


#sidebar  ul#menubar {
	list-style: none;
}
#sidebar ul#button {
	text-align: center;
	list-style: none;
	margin-top: 20px;
}
#sidebar ul#bannar {
	margin: 0px;
	padding-top: 20px;
	padding-left: 10px;
	list-style: none;
}
#sidebar ul#bannar li {
	padding-top: 5px;
}
#sidebar   #menu_mini   ul {
	margin: 0px;
	padding: 20px 0px 20px 20px;
}
#sidebar   #menu_mini   ul   li {
	list-style: none;
	margin: 0px 0px 10px;
	padding: 0px;
}
#sidebar #hassoubi {
	background-color: #FDFDFD;
	width: 160px;
	padding: 23px 10px 10px;
	margin: 10px;
	border: 1px solid #CC3467;
	text-align: center;
	font-weight: bold;
	color: #CC3467;
	background-image: url(icon_hassoubi.gif);
	background-repeat: no-repeat;
}
#sidebar #hassoubi p {
	font-size: 80%;
	font-weight: normal;
	color: #666666;
}

#sidebar #sidebar_curriculum {
	padding: 8px 0 4px 8px;
	overflow: hidden;
	width: 192px;
	border-bottom: 1px dashed #A8A8A8;
}

#sidebar #sidebar_curriculum li {
	list-style: none;
	float: left;
	margin: 0 6px 5px 0;
}
/*.kyouzaimi_sample {
	margin: 15px 0px;
}*/


/* footer styles
--------------------------*/
#footer1 {
	clear: both;
	margin: 0px;
	padding: 10px 0px 10px 15px;
	border-top: 2px solid #FF2D2D;
}
#footer1  ul  li {
	float: left;
	padding-right: 20px;
	list-style: none;
	background-image: url(yajirushi.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 15px;
	font-size: 95%;
}



#footer3 {
	padding-top: 10px;
	padding-right: 15px;
	padding-bottom: 10px;
	clear: both;
	text-align: center;
	background-color: #DFDFDF;
	font-size: 70%;
	color: #666666;
}
#footer3 a {
	color: #777777;
	text-decoration: none;
}
#footer3 a:hover {
	color: #3E3BC9;
	text-decoration: underline;
}

#footer4 {
	padding-top: 10px;
	text-align: right;
	padding-right: 15px;
	padding-bottom: 10px;
	clear: both;
}





/* table styles
--------------------------*/

table  {
	border-top: 1px solid #999999;
	border-left: 1px solid #999999;
	border-collapse: collapse
}
table#small {
	line-height: normal;
	margin-top: 10px;
}
table#smallc {
	padding: 0px;
	line-height: normal;
	margin-top: 0px;
	margin-right: 10px;
	margin-bottom: 0px;
	margin-left: 0px;
}
table#smallc td {
	margin: 0px;
	padding: 3px;
	font-size: 80%;
}


td  {
	border-right: 1px solid #999999;
	border-bottom: 1px solid #999999;
	padding: 10px;
	font-size: 90%;
}
td.tdgray {
	background-color: #EFEFEF;
}

td.tdyellow {
	background-color: #FFFFCC;
}
td.tdpink {
	background-color: #FFF0EE;
}
td.tdwhite {
	background-color: #FFFFFF;
}

td.tdorange {
	background-color: #FFF0E1;
}

td.tdgreen {
	background-color: #f3ffd9;
}
td.tdlemon {
	background-color: #FFFF80;
}


.non-frame {
	border-style: none;
	margin-top: 5px;
	margin-bottom: 5px;
}
.td_non-frame {
	border-style: none;
	padding: 0px;
}
.td_non-frame_pad10 {
	border-style: none;
	padding: 10px;
}
a.window {
	background-image: url(icon_window.gif);
	background-repeat: no-repeat;
	background-position: right center;
	margin: 0px;
	padding-right: 15px;
}
.baseline {
	vertical-align: baseline;
}
.clear {
	clear: both;
}
.bold {
	font-weight: bold;
}
.td_frame {
	border: 1px solid #999999;
}
.td_frame_pink {
	border: 1px solid #999999;
	background-color: #FFF0EE;
}
.gray {
	color: #999999;
}
.red {
	color: #FF0000;
}

a.yajirushi {
	background-image: url(yajirushi_red.gif);
	padding: 0px 0px 0px 10px;
	margin: 10px 0 0 0;
	background-repeat: no-repeat;
	background-position: left center;
}

.kyouzaimihon {
	padding: 10px;
	border: 2px solid #FF6699;
	background-color: #F7F7F7;
	margin: 20px 0;
}
.smallsize75 {
	font-size: 75%;
}

.smallsize90 {
	font-size: 90%;
}


.mb50 {
	margin-bottom: 50px;
}

.mb40 {
	margin-bottom: 40px;
}

.mb30 {
	margin-bottom: 30px;
}

.mb20 {
	margin-bottom: 20px;
}

.mb10 {
	margin-bottom: 10px;
}

.mt10 {
	margin-top: 10px;
}

.mr5 {
	margin-right: 5px;
}

.mlr5 {
	margin: 0 5px 0;
}

.tel_red {
	background-color: #FF9999;
}
.tel_yellow {
	background-color: #FFFF99;
}
.tel_blue {
	background-color: #99FFFF;
}
.tel_white {
	background-color: #FFFFFF;
}
.tel_table {
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	text-align: center;
	
}
.tel_gray {
	background-color: #CCCCCC;
}



.only_sp {
	display: none}
	
.only_pc {
	display: block}

.overflow {
	overflow: hidden;
}

.float_l{
	float:left
}

.acMenu .ac_title{
	display: block;
	line-height: 50px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-image: url(icon_plus.png);
	padding: 0 15px;
	background-position: 97% 50%;
	background-size: 22px 22px;
	margin: 0 0 20px 0;
	font-weight: bold;
	background-color: #eee;
    }
.acMenu .ac_inner{
	border: #eee solid 4px; 
	padding: 15px;
    display: none;
	margin: 0 0 20px 0;
	font-size: 95%;
    }
.acMenu .ac_title.active{
    background:url(icon_minus.png) no-repeat;
	background-position: 97% 50%;
	background-size: 22px 22px;
	background-color: #eee;
	margin: 0;
    }


/*教材サンプル*/

.kyouzaimi_sample {
	margin-bottom:30px;
}

.form_kyouzaimi_sample {
	background-image:url(../common/kyouzaimisample_img3.gif);
	background-repeat: no-repeat;
	padding: 0 0 10px 20px;
	background-position: bottom left;
	margin-bottom:5px;
}


.form_kyouzaimi_sample #mailaddress{
	height: 24px;
	width:100%;
	padding:1px 0 2px 0;
}
.form_kyouzaimi_sample input.submit_button {
   width: 65px;
   height: 30px;
   background-color: #ff3333;
   color: #ffffff;	
   border-style: none;
   -webkit-appearance: none;
   font-size:1.0rem;

}
.form_kyouzaimi_sample table.sample_tb{
	border: none;
}
.form_kyouzaimi_sample table.sample_tb tr td{
	border: none;
}





/* Only Smartphone
-------------------------------------------------------------------*/
@media screen and (max-width:480px){

/* other styles
--------------------------*/
.photo_left {
	float: left;
	margin-top: 5px;
	margin-right: 15px;
	margin-bottom: 5px;
}
.photo_right {
	float: right;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 15px;
}


/* basic layout
--------------------------*/
#container {
	position: relative;
	width: 100%;
	background-color: #fff;
	margin: 0 auto;
	border: 0px solid #FF3333;
}

#header #h1rogo {
	float: left;
	margin-top: 12px;
	margin-left: 12px;
}
#header #h1rogo #rogo {
	margin-top: 5px;
	max-width: 217px;
}
#header h1 {
	font-size: 9px;
	font-weight: normal;
}

#header #link {
	display: none;
}

#header ul {
	display: none;
}
#header ul li {
	list-style: none;
	float: left;
	padding-right: 6px;
	padding-top: 24px;
}
ul#top_banner {
	display: none;
}
#header_nabi {
	display: none;
}
ul#top_banner li {
	float: left;
	padding: 0px 10px 0px 0px;
	list-style: none;
	margin: 0px;
}

#pankuzu {
	margin: 60px 0px 0px 0px;
	float: none;
	font-size: 10px;
	width: auto;
	padding: 0px 0px 0px 10px;
	display: block;
}

#main {
	float: none;
	width: auto;
	margin: 0px;
	padding: 0px 10px 0px;
	display: block;
}

#sidebar {
	display: none;
}


#main    #top_menu    .list {
	width: auto;
	float: none;
	font-size: 95%;
	margin: 0 25px 10px 0;
	padding: 0px;
	overflow: hidden;
}
#main   #top_menu   img   {
	float: left;
	padding-right: 10px;
}
#main  #top_menu  h3 {
	background-image: none;
	margin: 0;
	padding: 0;
}
#main  #top_menu  h3  a {
	background-image: url(../images/icon_yajirushi_red.gif);
	background-repeat: no-repeat;
	background-position: left;
	font-size: 95%;
	margin-bottom: 5px;
	padding: 0 0 0 20px;
}

#hassoubi_sp {
	background-color: #FDFDFD;
	width: 70%;
	padding: 0 0 10px;
	margin: 10px auto;
	border: 3px solid #999;
	text-align: center;
	font-weight: bold;
	color: #FF3366;
}
#hassoubi_sp .title {
	background-color: #999999;
	padding: 4px;
	text-align: center;
	margin-bottom: 8px;
	color:#FFF;
}

#hassoubi_sp p {
	font-size: 80%;
	font-weight: normal;
	color: #666666;
	line-height: 1.5em;
}

#hassoubi_sp p#zengo {
	font-size: 60%;
	font-weight: normal;
	color: #999;
}


p#toplink {
	background-color: #888;
	float: right;
	margin-top: 20px;
}
p#toplink a {
	color: #FDF6C9 !important;
	text-decoration: none !important;
	line-height: 32px;
	font-size: 12px;
	padding: 0 20px;
	display: block;	
}


/* footer styles
--------------------------*/

#main #footer_menu {
	display: none;
}

	ul#sp_footer_menu {
		clear:both;
		padding: 0;
	}
	ul#sp_footer_menu li {
	background-color: #EEE;
	background-image: url(../common/icon_arrow.png);
	float: left;
	width: 50%;
	border-top: 1px solid #aaa;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-repeat: no-repeat;
	background-size: 12px auto;
	background-position: 90% 50%;
	list-style-type: none;
		}

/*奇数のli要素に適応*/
ul#sp_footer_menu li:nth-child(odd) {
  border-right: 1px solid #aaa;
}
	ul#sp_footer_menu li a {
	font-weight: bold;
	text-decoration: none;
	color: #6A6A6A;
	font-size: 13px;
	display: block;
	line-height: 44px;
	padding-left: 12px;
}

#footer1 {
	display: none;
}
#sp_footer_tel {
	 border-top: 2px solid #FF312D;
	 clear: both;
	 padding: 20px;
	 background-color: #FDFADB;
 }

#footer2 ul li{
	font-size: 9px;
	width: 25%;
	background-color: #444;
	float: left;
	list-style: none;
	box-sizing: border-box;
	border-right: 1px solid #FFF;
	text-align: center;
}
#footer2 ul li a{
	color: #FFF;
	text-decoration: none;
	line-height: 30px;
	display: block;
	vertical-align: middle;
}
#footer2 ul li:last-child{
	border-right: none;
}

#main .pctb_float_right,
#main .pctb_float_left {
	padding: 0px 0px 20px 0px;
	margin:0px auto;
	float: none;
	display: block;
}

.pc_margin0 {
	margin: auto !important;
}

.center {
	clear: both;
	float: none;
	margin: 0 auto 10px !important;
	align-items: center;
}

.max_width250 {
	max-width: 250px;
}

.max_width200 {
	max-width: 200px;
}

.max_width160 {
	max-width: 160px;
}

.max_width150 {
	max-width: 150px;
}

.max_width100 {
	max-width: 100px;
}
.max_width20 {
	max-width: 20px;
}
.only_pc {
	display: none;}
	
.only_sp {
	display: block;
	}


/* table styles
--------------------------*/

table  {
	width: auto;
}


.accordion{
	padding:3px;
	margin:3px;
	display:none;
}

.button {
	border-radius: 5px;
	-webkit-border-radius: 5px;
	border: solid 1px #999;
/*	background-color: #DBDBDB;
	background: -moz-linear-gradient(top, #DBDBDB, #A6A6A6); 
    background: -webkit-gradient(linear, left top, left bottom, from(#DBDBDB), to(#A6A6A6));
	background: -webkit-linear-gradient(top, #DBDBDB, #A6A6A6);
	background: -o-linear-gradient(top, #DBDBDB, #A6A6A6);
	background: linear-gradient(top, #DBDBDB, #A6A6A6);
	font-weight: bold;*/
	text-shadow: 1px 1px 2px #ccc;
	padding: 8px 16px;
	margin-bottom:10px;
}

.button  a {
	color: #666;
	text-decoration:none;
	display: block;
}

.close {
	text-align: center;
	margin-top: 20px;
	padding: 5px;
	background-color: #eee;
}

.close a {
	color: #666;
	text-decoration: none;
	font-size: 11px;
	text-align: center;
}

.sp_footer_logo {
	margin: 10px auto;
	width: 229px;
}

/*教材サンプル*/	
	
.kyouzaimi_sample {
	width:100%;
	overflow:hidden;
	position: relative;
	margin-bottom:20px;
}

.form_kyouzaimi_sample {
	background-image:url(../common/kyouzaimisample_img3.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 100% auto;
	padding: 0 20px;
}

.form_kyouzaimi_sample #mailaddress {
	width: 99%;
	
}
	
input.submit_button.sp_btn{
	width: 40px;
	margin-left: 150px;
}
.sp_tb{
	width: 100%;
}
.kyouzaimi_sample .form_kyouzaimi_sample tr {
	display:block;
}
.kyouzaimi_sample .form_kyouzaimi_sample td {
	display:block;
	width: 100%;
	padding: 10px 0 0;
}
.form_kyouzaimi_sample input.submit_button {
   width: 100%;
	border-radius:5px;
	padding:4px 0;
	margin-bottom:15px;
	height:auto;
	font-size:1.1rem;
}

.kyouzaimi_sample h3{
	background-image: none;
	padding: 0px;
}
.sp {
    display: block;
}
}



/* Only PC/Tablet
-------------------------------------------------------------------*/
@media screen and (min-width : 481px) {

/*スマホナビゲーション*/
nav.naver {
	display:none;
}
.pc_max_width300 {
	max-width: 300px;
}

.pc_max_width250 {
	max-width: 250px;
}

.pc_max_width200 {
	max-width: 200px;
}

.pc_max_width160 {
	max-width: 160px;
}

.pc_max_width150 {
	max-width: 150px;
}

.pc_max_width100 {
	max-width: 100px;
}


}