@charset "UTF-8";

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

Title : default.css
For   : Resetting styles
        (Format browser's default styles and setting HTML elements styles)

Created       : 2009-1-16
Last Modified :

/*===== CONTENTS ===========================================

	 1: RESET
	 2: FONTS
	 3: LINKS
     4: ELEMENT

==========================================================*/

/*======================================

	1: RESET

=======================================*/

html {
	overflow-y: scroll;
	height: 100%;
}

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


dt,dd,li {
	text-indent: 0;
}

th,td,caption {
	text-align: left;
}

img,fieldset {
	border: none;
	vertical-align: bottom;
}

/*======================================

	2: FONTS

=======================================*/

body {
	color: #505050;
	background: #ffffff;
	font-size: 80%;
	font-family: Verdana,"Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	line-height: 1.0;
	text-align: center;
}

h1,h2,h3,h4{
	font-size: 100%;
}

h1,h2,h3,h4,p,li,dt,dd,th,td{
	line-height: 1.2;
}


/*======================================

	3: LINKS

=======================================*/

a:link {
	color:#3795ff;
}
a:visited {
	color:#3795ff;
}
a:hover {
	color:#82bdff;
}

a.red:link {
	color:#e50072;
	font-weight: bold;
}

a.red:visited {
	color:#e50072;
	font-weight: bold;
}

a.red:hover {
	color:#ff48a3;
	font-weight: bold;
}

a.red_nonbold:link {
	color:#e50072;
}

a.red_nonbold:visited {
	color:#e50072;
}

a.red_nonbold:hover {
	color:#ff48a3;
}

a.black:link {
	color:#333333;
}

a.black:visited {
	color:#333333;
}

a.black:hover {
	color:#777777;
}

th a:link {
	color: #af3939;
	font-weight: bold
	text-decoration: underline;
}

th a:visited {
	color: #af3939;
	font-weight: bold
	text-decoration: none;
}

th a:hover {
	color:#df4949;
	font-weight: bold
	text-decoration: underline;
}

/*======================================

    4: ELEMENT

=======================================*/

/*======================================

    4-1: PALAGLAPH ELEMENTS

=======================================*/

p {
    margin: 0 5px 15px;
    line-height: 1.5;
}

p.small,
span.small {
    font-size: 80%;
}

p.gray,
span.gray {
    color: #818181;
}

p.no_item {
    margin: 35px 0 50px;
    text-align: center;
    font-size: 116%;
    font-weight: bold;
}

p.caption {
    text-align: center;
    font-weight: bold;
    line-height: 1;
    margin-bottom: 5px;
}

p.left_caption {
    font-weight: bold;
    line-height: 1;
    margin: 0 0 5px 0;
}

p.separate {
    padding-bottom: 15px;
    background: url('/img/common/img_separate_line_l.gif') no-repeat left bottom;
}

p.red,
td.red,
span.red {
    color: #CD396A;
}


strong {
    color: #CD396A;
    font-weight: normal;
}

strong.normal {
    color: #505050;
    font-weight: bold;
}

/* 2010/06/21 added */

p.period_txt {
    margin: 20px 0 15px;
    text-align: center;
    font-size: 116%;
    font-weight: bold;
    color: #CD396A;
}

/*======================================

    4-2: HEADINGS

=======================================*/

h2.middle {

    padding-left: 10px;
    margin-bottom: 15px;
    color: #fff;
    font-size: 14px;
    line-height: 38px;
    background: url('/img/common/bg_h2.gif') no-repeat left top;

    /* for windows IE5.x */

    width: 440px;
    height: 38px;

    voice-family: "\"}\"";
    voice-family: inherit;

    /* exclude windows IE5.x */

    width: 430px;
    height: 38px;

}

h2.short {
    height: 38px;
    padding-left: 10px;
    color: #fff;
    font-size: 14px;
    line-height: 38px;
    background: url('/img/common/bg_h2_s.gif') no-repeat left top;

    /* for windows IE5.x */

    width: 200px;

    voice-family: "\"}\"";
    voice-family: inherit;

    /* exclude windows IE5.x */

    width: 190px;
}

h2.short_double {
    margin-bottom: 0;
    padding: 14px 0 0 10px;
    color: #fff;
    font-size: 14px;
    line-height: 1.2;
    background: url('/img/common/bg_h2_s02.gif') no-repeat left top;

    /* for windows IE5.x */

    width: 200px;
    height: 60px;

    voice-family: "\"}\"";
    voice-family: inherit;

    /* exclude windows IE5.x */

    width: 190px;
    height: 46px;
}

h2.long {
    height: 38px;
    padding-left: 10px;
    margin-bottom: 15px;
    color: #fff;
    font-size: 14px;
    line-height: 38px;
    background: url('/img/common/bg_h2_l.gif') no-repeat left top;

    /* for windows IE5.x */

    width: 660px;

    voice-family: "\"}\"";
    voice-family: inherit;

    /* exclude windows IE5.x */

    width: 650px;
}

.index_title {
    overflow: hidden;
    width: 440px;
    height: 38px;
    padding-bottom: 15px;
}

h2.separate {
    float: left;
    height: 38px;
    padding-left: 10px;
    color: #fff;
    font-size: 14px;
    line-height: 38px;
    background: url('/img/common/bg_h2_l.gif') no-repeat left top;

    /* for windows IE5.x */

    width: 315px;

    voice-family: "\"}\"";
    voice-family: inherit;

    /* exclude windows IE5.x */

    width: 305px;
}

.index_title .btn {
    float: right;
    display: block;
    width: 125px;
    height: 38px;
    background: url('/img/book/bg_h2_btnback.gif') no-repeat left top;
}

.index_title .btn img {
    margin: 4px 0 0 7px;
}

h1.txt,
h2.txt {
    margin-bottom: 12px;
    padding-left: 5px;
    font-size: 133%;
}

h2.comp {
    font-size: 166%;
}

h2.red {
    color: #CD396A;
}

h3 {
    margin-bottom: 5px;
    padding-left: 12px;
    font-size: 14px;
    line-height: 20px;
    background: url('/img/common/bg_h3.gif') no-repeat left top;
}

h3.txt {
    margin-bottom: 12px;
    padding-left: 5px;
    font-size: 133%;
    background: none;
}



/*======================================

    4-3: BOX

=======================================*/

ul.disc {
    margin-left: 35px;
    list-style: disc;
}

/*-- doubleline_box --*/
.doubleline_box {
    margin: 0;
    padding: 15px 10px 13px;
    border: 3px #d89898 double;
    background-color: #fff4f4;
}

.doubleline_box dl dt.att {
    display: block;
    margin-bottom: 10px;
    font-size: 120%;
    font-weight: bold;
}

.doubleline_box dl dd ul {
    margin-left: 20px;
    list-style: disc;
}

.doubleline_box dl dd ul li {
    margin-bottom: 5px;
}

.doubleline_box dl dd.txt {
    padding: 7px 0;
    line-height: 1.5;
}

/*-- purple_box --*/
.purple_box {
    overflow: hidden;
    padding: 12px 20px;
    background-color: #f3e2fc;
}

.purple_box dt {
    display: block;
    font-size: 120%;
    font-weight: bold;
    color: #5a4c6d;
}

.purple_box dd {
    margin-top: 7px;
    line-height: 1.4;
    margin-bottom: 0;
}

.purple_box dd.pct_credit {
    width: 620px;
    margin-top: 15px;
}

.purple_box dd.pct_credit img {
    float: left;
    display: block;
    width: 234px;
    margin-right: 25px;
}


.purple_box dd.pct_credit p {
    float: right;
    width: 350px;
}

.purple_box dd.pct_credit_s {
    width: 400px;
    margin-top: 15px;
}

.purple_box dd.pct_credit_s img {
    float: right;
    display: block;
    width: 178px;
    margin-left: 25px;
}

.purple_box dd.pct_credit p.att,
.purple_box dd.pct_credit_s p.att {
    color: #CD396A;
}

/*-- pink_box --*/
.pink_box {
    padding: 12px 20px;
    background-color: #fee7ea;
}

.pink_box dt {
    display: block;
    font-size: 120%;
    font-weight: bold;
    color: #CD396A;
}

.pink_box dd {
    margin-top: 7px;
    line-height: 1.4;
    margin-bottom: 0;
}


div.separate_box {
    padding-bottom: 5px;
    background: url('/img/common/img_separate_line_l.gif') no-repeat left bottom;
}
/*-- attention_box --*/
.attention_box {
    overflow: hidden;
    padding: 10px;
    background-color: #f3e2fc;
    font-size: 0.92em;
}

.attention_box dt {
    display: block;
    font-weight: bold;
    color: #ff0000;
}

.attention_box dd {
    font-size: 0.9em;
    margin-top: 3px;
    line-height: 1.4;
    margin-bottom: 0;
}

/*-- main_box --*/

#maintenance_box {
    margin: 0 4px 10px;
    padding: 1px;
    border: 2px #9d009f solid;
    background-color: #f2e2fc;
}

#maintenance_box .maintenance_box_wrap {
    padding: 17px 15px;
    border: 1px #9d009f solid;
    background-color: #f2e2fc;
}

#maintenance_box .maintenance_box_wrap dl dt {
    margin-bottom: 10px;
    padding-left: 20px;
    color: #5a4c6d;
    font-size: 130%;
    font-weight: bold;
    line-height: 1;
    background: url("/img/common/alert_icon.gif") no-repeat left 0.05em;
}

#maintenance_box .maintenance_box_wrap dl dd {
    color: #505050;
}


/*======================================

    4-4: TABLE

=======================================*/
.ast {
    color: #d80079;
}

p.table_caption {
    margin-bottom: 2px;
}

table tr.gray,
table th.gray,
table td.gray {
    background-color: #f1f1f1;
}

table.form_table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 1;
    font-size: 100%;
}

table.form_table th {
    padding: 10px;
    color: #af3939;
    vertical-align: top;
    border: 1px #efaaa3 solid;
    background-color: #ffefef;
}

table.form_table th.gray {
    color: #505050;
    background-color: #f1f1f1;
}

table.form_table td {
    padding: 10px;
    vertical-align: middle;
    border: 1px #efaaa3 solid;
}

/* 2010/06/21 added */
table.form_table td.point {
    padding: 10px;
    vertical-align: middle;
    border: 1px #efaaa3 solid;
    text-align: right;
}

p.p_link {
    text-align: right;
}

table.form_table th.border,
table.form_table td.border {
    border-top: 2px #efaaa3 solid;
}

/* 2010/06/21 added */


table p.att {
    margin: 3px 0 0;
}

table sup {
    color: #d80079;
}

table th p {
    margin: 5px 0 0;
    font-weight: normal;
    line-height: 1.2;
}

td strong {
    color: #505050;
}

table.inside_table {
    margin: 10px 10px;
    border-collapse: collapse;
    border-spacing: 1;
    font-size: 100%;
    border: none;
}

table.inside_table th {
    padding: 10px 3px;
    color: #505050;
    vertical-align: top;
    border: none;
    background-color: transparent;
}

table.inside_table td {
    padding: 8px 3px;
    vertical-align: top;
    border: none;
    background-color: transparent;
}

table.inside_table td input {
    margin: 0;
}

table.purchase_table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 1;
    font-size: 100%;
}

table.purchase_table th {
    padding: 10px;
    color: #505050;
    vertical-align: top;
    text-align: center;
    border: 1px #ffffff solid;
    background-color: #c5dceb;
}

table.purchase_table th.total_pricetxt {
    padding-right: 20px;
    text-align: right;
    color: #505050;
    font-weight: bold;
    background-color: #f1f1f1;
}

table.purchase_table td {
    background-color: #edf5fd;
    border: 1px #ffffff solid;
}

table.purchase_table td.book_image {
    padding: 10px 10px 10px 30px;
    border-right: none;
}

table.purchase_table td.book_title {
    padding: 10px 30px 10px 10px;
    font-weight: bold;
    border-left: none;
}

table.purchase_table td.price {
    padding: 10px;
    text-align: center;
    font-weight: bold;
    vertical-align: middle;
}

table.purchase_table td.total_price {
    padding: 10px;
    text-align: center;
    color: #d80079;
    font-weight: bold;
    vertical-align: middle;
    background-color: #f1f1f1;
}

table.guide_table {
    width: 660px;
    margin: 0 0 30px;
    border-collapse: collapse;
    border-spacing: 1;
    font-size: 100%;
    background-color: #ffefef;
}

table.guide_table th {
    padding: 10px 10px 10px 20px;
    vertical-align: middle;
    border-bottom: 2px #ffffff solid;
}

table.guide_table th span {
    display: block;
    padding-left: 20px;
    background: url("/img/common/bg_diamond02.gif") no-repeat left top;
}

table.guide_table td {
    padding: 0 10px 0 30px;
    vertical-align: middle;
    border-bottom: 2px #ffffff solid;
}

table.guide_table td a {
    display: block;
    margin: 10px 0;
    padding-left: 9px;
    background: url("/img/common/icon_link.gif") no-repeat left 5px;
}

table.guide_table th.last,
table.guide_table td.last {
    border: none;
}

table.guide_table02 {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 1;
    text-align: center;
    font-size: 100%;
}

table.guide_table02 th {
    padding: 10px;
    text-align: center;
    color: #af3939;
    vertical-align: middle;
    border: 1px #efaaa3 solid;
    background-color: #ffefef;
}

table.guide_table02 th span {
    display: block;
    margin-top: 10px;
    font-weight: normal;
}

table.guide_table02 th.gray {
    padding: 10px;
    text-align: center;
    color: #505050;
    vertical-align: middle;
    border: 1px #efaaa3 solid;
    background-color: #f1f1f1;
}

table.guide_table02 td {
    padding: 10px;
    text-align: center;
    vertical-align: middle;
    border: 1px #efaaa3 solid;
    background-color: #ffffff;
}

table.guide_table02 td img {

}

table.guide_table02 td ul li.page {
    color: #d80079;
    font-size: 120%;
    font-weight: bold;
}

table.guide_table02 td ul li.explain {
    font-size: 80%;
}

/* 2011/03/09 added */
table.paymethod_table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 1;
    font-size: 100%;
}

table.paymethod_table th {
    padding: 10px;
    color: #505050;
    vertical-align: top;
    border: 1px #ffffff solid;
    background-color: #c5dceb;
}

table.paymethod_table td {
    background-color: #edf5fd;
    padding: 3px;
}


/*======================================

    4-5: FORM

=======================================*/

input.textfiled {
    padding: 2px 5px;
    border: 1px #bcbcbc solid;
}

.submit_area {
    width: 660px;
    margin-top: 15px;
}

.submit input,
.post-btn{
    margin: 5px auto;
    padding: 0.5rem 0;
    min-width: 232px;
    border-radius: 4px;
    display: inline-block;
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.2);
    text-align: center;
    font-weight: bold;
    border: 1px solid #aaaaaa;
    background-color: #e3e3e3;
    color: #5c5c5c;
    -webkit-transition: all .3s ease-in;
            transition: all .3s ease-in;
    cursor: pointer;
}

.submit input:hover,
.post-btn:hover{
    background-position: 0 -44px;
    background-color: #efefef;
}

.input_confirm input {
    display: block;
    border: none;
    width: 231px;
    height: 44px;
    margin: 0 auto;
    text-indent: -9999px;
    background: url("/img/help/btn_inputconfirm.gif") no-repeat 0 0;
    cursor: pointer;
}

#login_btn input {
    display: block;
    border: none;
    width: 200px;
    height: 42px;
    margin: 0 auto;
    text-indent: -9999px;
    background: url("/img/common/btn_login.gif") no-repeat 0 0;
    cursor: pointer;
}

.form_table td span {
    line-height: 1;
}

textarea {
    font-size: 100%;
    margin: 0;
    padding: 5px;
    letter-spacing: 0;
}

span.required {
    display: inline;
    margin-left: 3px;
    padding: 0;
}

span.required img {
    margin: 0;
    padding: 0;
    border: none;
    vertical-align: middle;
}

.error_mes {
    margin-bottom: 20px;
    padding: 10px;
    border: 3px #CD396A double;
    background-color: #ffefef;
}

.error_mes p {
    font-size: 122%;
    font-weight: bold;
}

.error_mes ul {
    margin-bottom: 10px;
}

.error_mes ul li {
    margin: 5px 0 0 15px;
    font-weight: bold;
}

.error_mes ul li span {
    margin-right: 5px;
}

/*-- ime mode --*/

input#mail01,
input#mail02,
input#id,
input#pass {
    ime-mode: disabled;
}


/*======================================

    4-6: LIST

=======================================*/

ul {
    list-style-type: none;
}

ul.mark_list {
    list-style-type: disc;
    list-style-position: inside;
}

ul.mark_list li {
    line-height: 1.3;
}


ul li {
    line-height: 1.3;
}

ul.att {
    color: #CD396A;
}

ul li.att {
    color: #CD396A;
}

ol {
    margin-left: 30px;
}

/*======================================

    4-7: EVALUATION

=======================================*/

img.evaluation {
    display: block;
    padding-bottom: 3px;
}

/*======================================

    4-0: UNIVERSAL CLASS

=======================================*/

/*-- temporary --*/

.flow_chart  {
    margin-bottom: 30px;
}

.flow_chart dt {
    margin-bottom: 10px;
}

.flow_chart dd ul li {
    display: inline;
}

.invisible {
    display: none;
}

img.book_img {
    border: 1px #cdcdcd solid;
}

.claer { clear: both; }

.elementCenter { text-align: center; }
.elementRight { text-align: right; }
.elementMiddle { vertical-align: middle; }

.bold { font-weight: bold; }

.width50 { width: 50px; }
.width100 { width: 100px; }
.width150 { width: 150px; }
.width200 { width: 200px; }
.width250 { width: 250px; }
.width300 { width: 300px; }
.width350 { width: 340px; }
.width400 { width: 400px; }
.width450 { width: 440px; }
.width450 { width: 450px; }
.width500 { width: 500px; }
.width550 { width: 550px; }
.width600 { width: 600px; }
.width600 { width: 660px; }

.height50 { height: 50px; }
.height100 { height: 100px; }
.height200 { height: 200px; }
.height250 { height: 250px; }
.height300 { height: 300px; }
.height350 { height: 340px; }
.height400 { height: 400px; }
.height450 { height: 450px; }
.height500 { height: 500px; }
.height550 { height: 550px; }
.height600 { height: 600px; }

.mgnTop0 {margin-top: 0px;}
.mgnTop3 {margin-top: 3px;}
.mgnTop5 {margin-top: 5px;}
.mgnTop8 {margin-top: 8px;}
.mgnTop9 {margin-top: 9px;}
.mgnTop10 {margin-top: 10px;}
.mgnTop11 {margin-top: 11px;}
.mgnTop15 {margin-top: 15px;}
.mgnTop20 {margin-top: 20px;}
.mgnTop25 {margin-top: 25px;}
.mgnTop30 {margin-top: 30px;}
.mgnTop35 {margin-top: 35px;}
.mgnTop40 {margin-top: 40px;}
.mgnTop45 {margin-top: 45px;}
.mgnTop50 {margin-top: 50px;}

.mgnBottom0 {margin-bottom: 0px;}
.mgnBottom3 {margin-bottom: 3px;}
.mgnBottom5 {margin-bottom: 5px;}
.mgnBottom8 {margin-bottom: 8px;}
.mgnBottom10 {margin-bottom: 10px;}
.mgnBottom15 {margin-bottom: 15px;}
.mgnBottom20 {margin-bottom: 20px;}
.mgnBottom25 {margin-bottom: 25px;}
.mgnBottom30 {margin-bottom: 30px;}
.mgnBottom35 {margin-bottom: 35px;}
.mgnBottom40 {margin-bottom: 40px;}
.mgnBottom45 {margin-bottom: 45px;}
.mgnBottom50 {margin-bottom: 50px;}

.mgnLeft0 {margin-left: 0px;}
.mgnLeft3 {margin-left: 3px;}
.mgnLeft5 {margin-left: 5px;}
.mgnLeft8 {margin-left: 8px;}
.mgnLeft9 {margin-left: 9px;}
.mgnLeft10 {margin-left: 10px;}
.mgnLeft11 {margin-left: 11px;}
.mgnLeft15 {margin-left: 15px;}
.mgnLeft20 {margin-left: 20px;}
.mgnLeft25 {margin-left: 25px;}
.mgnLeft30 {margin-left: 30px;}
.mgnLeft35 {margin-left: 35px;}
.mgnLeft40 {margin-left: 40px;}
.mgnLeft45 {margin-left: 45px;}
.mgnLeft50 {margin-left: 50px;}

.mgnRight0 {margin-right: 0px;}
.mgnRight3 {margin-right: 3px;}
.mgnRight5 {margin-right: 5px;}
.mgnRight8 {margin-right: 8px;}
.mgnRight9 {margin-right: 9px;}
.mgnRight10 {margin-right: 10px;}
.mgnRight11 {margin-right: 11px;}
.mgnRight15 {margin-right: 15px;}
.mgnRight20 {margin-right: 20px;}
.mgnRight25 {margin-right: 25px;}
.mgnRight30 {margin-right: 30px;}
.mgnRight35 {margin-right: 35px;}
.mgnRight40 {margin-right: 40px;}
.mgnRight45 {margin-right: 45px;}
.mgnRight50 {margin-right: 50px;}

*html .purchase_icon img {
    behavior: expression(IEPNGFIX.fix(this));
}

*html .course_box ul.btns_area li img {
    behavior: expression(IEPNGFIX.fix(this));
}
