@charset "UTF-8";

/* ========================================================= [ #w ] */

#w h1,
#w h2,
#w h3,
#w p,
#w ol,
#w ul,
#w li,
#w dl,
#w dt,
#w dd {
    margin: 0;
    padding: 0;
}

#w ol,
#w ul {
    list-style: none;
}

.container{
    width: 916px;
    margin: auto;
}

.h_penetrate:hover {
    opacity: 0.7!important;
}

.h_underline:hover {
    text-decoration: underline!important;
}

body {
    margin: 0;
}

#w{
    margin: auto;
    width: 916px;
}

.cancel_contents {
  float: left;
  width: 50%;
  text-align: right;
}
.cancel_contents a{
  display: inline-block !important;
}
#page #content .btn_cancel {
    width: 175px;
    height: 32px;
    position: relative;
    display: block;
    text-align: center;
    color: #333333;
    background: #EEEEEE;
    border-radius: 16px;
    font-size: 12px;
    line-height: 32px;
    border: 0px;
    margin-left: 20px;
}
.red_mini {
  color: red;
  color: red;
  line-height: 16px;
  line-height: 16px;
  font-size: 11px;
  font-size: 11px;
 }

/* ========================================================= [ announce pagination ] */
#w .announce-pagination{
    display: block;
    margin-top: 28px;
}
#w .announce-pagination ul li{
    display: inline;
}
#w .announce-pagination ul li a,
#w .announce-pagination ul li.current,
#w .announce-pagination ul > span {
    background: #fff;
    border: 1px solid #d2d2d2;
    border-right: 0;
    float: left;
    padding: 6px 12px;
    text-decoration: none;
}
#w .announce-pagination ul li:last-child a,
#w .announce-pagination ul span.next.disabled{
    border-right: 1px solid #d2d2d2;
}
#w .announce-pagination ul li a:hover,
#w .announce-pagination ul li.current{
    color: #ff7f00 !important;
    background: #eee;
    text-decoration: none;
}
#w .announce-pagination ul > span.disabled {
    background: #eee;
    color: #b5b5b5;
}
/* ========================================================= [ #side-navi ] */

#side-navi {
    width: 165px;
}
#side-navi a.side-login {
    background: transparent;
    border-radius: 5px;
    border: 1px solid #333;
    color: #333;
    display: block;
    font-size: 16px;
    margin: 0 0 12px;
    padding: 5px 12px;
    text-align: center;
    text-decoration: none;
}
#side-navi a.side-login:hover {
    background: #333;
    color: #fff;
}
/* ========================= side-info */
#side-navi .side-info {
    padding: 8px;
    border: 1px #cfcfcf solid;
    border-radius: 5px 5px 0 0;
    background: #fff;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
    text-align: center;
}
#side-navi .side-info p.name {
    margin: -8px -8px 10px;
    padding: 4px;
    border-radius: 5px 5px 0 0;
    background: #e2f0f6;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
    word-break: break-all;
}
#side-navi .side-info p.name span {
    margin: 0 5px 0 0;
    font-size: 14px;
}
#side-navi .side-info dl.course {
    margin: 0 0 6px;
    text-align: center;
}
#side-navi .side-info dl.course dt {
    margin: 0 0 6px;
    padding: 0 0 6px;
    border-bottom: 1px #aaa dotted;
}
#side-navi .side-info p.total {
    width: 141px;
    margin: 0 auto 6px;
    padding: 32px 0 20px;
    text-align: center;
}
#side-navi .side-info p.total span {
    line-height: 56px;
    margin: 6px 0;
    font-size: 56px;
    font-family: Arial;
    font-weight: bold;
}
#side-navi .side-info p.total.visitor {
    background: url(//www.dmm.com/images/general/eikaiwa/sidenavi/bg_visitor.png) no-repeat center top;
}
#side-navi .side-info p.total.bronze {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/sidenavi/bg_bronze.png) no-repeat center top;
}
#side-navi .side-info p.total.silver {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/sidenavi/bg_silver.png) no-repeat center top;
}
#side-navi .side-info p.total.gold {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/sidenavi/bg_gold.png) no-repeat center top;
}
#side-navi .side-info p.total.platinum {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/sidenavi/bg_platinum.png) no-repeat center top;
}
#side-navi .side-info p.total.crystal {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/sidenavi/bg_crystal.png) no-repeat center top;
}
#side-navi .side-info p.total.master {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/sidenavi/bg_master.png) no-repeat center top;
}
#side-navi .side-info p.total.legend {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/sidenavi/bg_legend.png) no-repeat center top;
}
#side-navi .side-info p.levelup {
    margin: 10px 0;
    text-align: center;
}
#side-navi .side-info p.levelup span {
    margin: 0 6px;
    font-size: 20px;
    font-family: Arial;
    font-weight: bold;
}
#side-navi .side-info ul.count {
    border-radius: 5px;
    background: #f3f3f3;
    color: #666;
    margin-top: 6px;
    text-align: left;
}
#side-navi .side-info ul.count li {
    border-bottom: 1px dotted #aaa;
    font-size: 12px;
    line-height: 18px;
    overflow: hidden;
    padding: 5px 8px;
    text-align: center;
}
#side-navi .side-info ul.count li dl dt {
    display: inline;
}
#side-navi .side-info ul.count li dl dt span {
    float: left;
}
#side-navi .side-info ul.count li dl dd {
    float: right;
}
#side-navi .side-info ul.count li em {
    color: #5BBFEC;
    font-size: 14px;
    font-style: normal;
}
#side-navi .side-info ul.count li#ticket-popover:hover {
    cursor: pointer;
    opacity: 0.6;
}
#side-navi .side-info ul.count li:last-child {
    border: 0;
}
#side-navi .side-info ul.count li img {
    float: left;
    /*margin: 4px 0 0 4px;*/
    margin: 4px -10px 0 4px;
}

.plus-ticket-wrap {
   padding: 5px 0 0 0;
}
.plus-ticket-number img, .plus-ticket-native-number img {
   width: 20px;
   margin-right: 5px;
   vertical-align: text-top;
}
.plus-ticket-number span, .plus-ticket-native-number span {
    margin-right: 3px;
    font-size: 17px;
    font-family: Arial;
    font-weight: bold;
    color: #1cabee;
}
.plus-ticket-number span {
    color: #1cabee;
}
.plus-ticket-native-number span {
    color: #BFA375;
}

.plus-ticket-buy {
    margin: 8px 0 4px 0;
}

.plus-ticket-buy a {
   width: 100%;
   display: block;
   padding: 7px 0 8px 0;
   text-align: center;
   color: #fff !important;
   background: #fd8424;
   border-radius: 100px;
}

.plus-ticket-buy a:hover {
   text-decoration: none;
}
p.native-trial-text small {
    font-size: 10px;
}

.native-trial-date {
  position: relative;
  margin: 10px 0 5px 0;
  padding: 6px 0 0 0;
  color: #765A3C;
  background: #ffffff;
  border: 1px solid #dfd7cb;
    border-radius: 5px;
}
.native-trial-date:after, .native-trial-date:before {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.native-trial-date:after {
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #ffffff;
  border-width: 5px;
  margin-left: -5px;
}
.native-trial-date:before {
  border-color: rgba(223, 215, 203, 0);
  border-bottom-color: #dfd7cb;
  border-width: 6px;
  margin-left: -6px;
}
.native-trial-date span {
    margin-left: 3px;
    font-size: 14px;
    font-weight: bold;
}
.native-trial-date p {
    margin-top: 4px !important;
    padding: 5px 0 3px 0 !important;
    background: #dfd7cb;
    font-size: 10px;
}
.native-trial-buy {
    margin: 8px 0 4px 0;
}
.native-trial-buy a {
    width: 100%;
    display: block;
    padding: 7px 0 8px 0;
    text-align: center;
    color: #fff !important;
    background: #765A3C;
    border-radius: 100px;
}
.native-trial-buy a:hover {
    text-decoration: none;
}

#side-navi .side-info .plus-ticket-wrap .plus-ticket-expiration {
   padding-top: 1px;
}

#side-navi .side-info .plus-ticket-wrap .plus-ticket-expiration p.ticket-expiration,
#side-navi .side-info .plus-ticket-wrap .plus-ticket-expiration p.ticket-expiration-native{
   font-size: 11px;
   text-decoration: underline;
   cursor: default;
}

#side-navi .side-info .plus-ticket-wrap .plus-ticket-expiration p.ticket-expiration > .icon-circle,
#side-navi .side-info .plus-ticket-wrap .plus-ticket-expiration p.ticket-expiration-native > .icon-circle
{
    background: none repeat scroll 0 0 #6bcdf5;
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 8px;
    height: 11px;
    line-height: 11px;
    margin-left: 3px;
    padding: 1px;
    vertical-align: baseline;
    width: 11px;
}

#side-navi .side-info .plus-ticket-wrap .plus-ticket-expiration p.ticket-expiration > .icon-circle {
    background: none repeat scroll 0 0 #6bcdf5;
}

#side-navi .side-info .plus-ticket-wrap .plus-ticket-expiration p.ticket-expiration-native > .icon-circle {
    background: none repeat scroll 0 0 #BFA375;
}

#side-navi .side-info .ticket-wrap {
    border-radius: 8px;
    margin-top: 3px;
    padding: 3px 0;
    position: relative;
}

#side-navi .side-info .ticket-wrap > p > span {
    color: #56beee;
    font-size: 17px;
    font-family: Arial;
    font-weight: bold;
    margin: 0 2px 0 0;
    vertical-align: bottom;
}

#side-navi .side-info .ticket-wrap p.ticket-expiration {
    background: #5BBFEC;
    border-radius: 10px;
    color: #fff;
    cursor: default;
    font-size: 10px;
    margin-top: 5px;
}

#side-navi .side-info .ticket-wrap p.ticket-expiration > .icon-circle {
    background: none repeat scroll 0 0 #fff;
    border-radius: 50%;
    color: #56beee;
    display: inline-block;
    font-size: 8px;
    height: 11px;
    line-height: 11px;
    margin-left: 3px;
    vertical-align: baseline;
    width: 11px;
}

#side-navi .side-info .ticket-wrap p.ticket-expiration > .exclamation {
    background: #f14c4e;
    border: 1px solid #fff;
    color: #fff;
}

#side-navi .side-info .side-current-course > dl dt {
    background: #626262;
    color: #fff;
    font-size: 12px;
    margin: 0 -8px;
    padding: 1px 0;
}

#side-navi .side-info .side-current-course > dl dt.side-pluslesson {
    margin-top: 15px !important;
    padding: 3px 0 !important;
    background: #1cabee;
}

#side-navi .side-info .side-current-course > dl dt.side-pluslesson-native {
    margin-top: 15px !important;
    padding: 3px 0 !important;
    background: #BFA375;
    letter-spacing: -.5px;
}

#side-navi .side-info .side-current-course > dl dd {
    border-bottom: 1px dotted #cfcfcf;
    font-size: 15px;
    font-weight: bold;
    padding: 2px 0 5px;
    padding: 5px 0;
}

#side-navi .side-info .side-current-course > dl dd.free {
    border-bottom: none;
    padding-top: 10px;
}
#side-navi .side-info .side-current-course > dl dd.standard_plan {
    color: #333333;
    font-size: 15px;
    line-height: 21px;
    padding-top: 5px;
}

#side-navi .side-info .side-current-course > dl dd.native_plan {
    color: #333333;
    font-size: 13px;
    line-height: 21px;
    padding-top: 5px;
}

#side-navi .side-info .side-current-course > dl dd.native_plan span.heading {
    font-size: 14px;
    letter-spacing: -0.7px;
}

#side-navi .side-info .side-current-course .concierge_btn {
    width: 100%;
    font-size: 12px;
    line-height: 17px;
    padding: 5px;
    border: 1px dotted #888;
    border-radius: 5px;
    box-sizing: border-box;
    margin: 5px 0 15px;
}
#side-navi .side-info .side-current-course .concierge_btn a {
    display: block;
    width: 100%;
    height: 35px;
    font-size: 12px;
    font-weight: bold;
    line-height: 35px;
    text-align: center;
    margin-top: 5px;
    border-radius: 17px;
}
#side-navi .side-info .side-current-course .concierge_btn a:hover {
    text-decoration: none;
}
#side-navi .side-info .side-current-course .concierge_btn a.ready {
    color: #FFFFFF;
    background: #FF8400;
}
#side-navi .side-info .side-current-course .concierge_btn a.book {
    background: #FFFFFF;
    color: #FF8400;
    border: 2px solid #FF8400;
}
#side-navi .side-info .side-current-course .concierge_btn a.done {
    background: #CCCCCC;
    color: #FFFFFF;
}

#side-navi .side-info .course-date h3 {
    color: #787878;
    font-size: 12px;
    padding: 5px 0 0;
}

#side-navi .side-info .course-date p span {
    border-top-color: #56beee;
    display: block;
    margin: 2px auto;
}

#side-navi .side-info .course-date > p {
    font-size: 12px;
    margin: 4px 0;
    line-height: normal !important;
}

#side-navi .side-info .popover-ticket {
    color: #5c5c5c;
    margin: 0;
    padding: 0 10px 10px 10px;
    text-align: left !important;
    width: 177px;
}

#side-navi .side-info .popover-title {
    padding: 8px 0;
    border: 0;
    font-size: 12.5px;
    font-weight: bold;
}

#side-navi .side-info .popover-title img {
   width: 25px;
   margin-right: 5px;
   vertical-align: text-top;
}


#side-navi .side-info .popover > .arrow {
    border-color: rgba(255, 255, 255, 0) #fff rgba(255, 255, 255, 0) rgba(255, 255, 255, 0);
    padding-left: 0;
}

#side-navi .side-info .popover > .arrow:after {
    border-right-color: #fff !important;
}

#side-navi .side-info .popover-ticket .popover-content {
    padding: 0;
}

#side-navi .side-info .popover-ticket .popover-content > ul {
    background: #fff;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    max-height: 200px;
    overflow-y: auto;
    border: 3px solid #f3f3f3;
    padding: 0 7px 7px;
}

#side-navi .side-info .popover-ticket .popover-content > ul li {
    border-bottom: 1px dotted #ddd;
    font-size: 12px;
    line-height: 22px;
    padding: 2px 5px !important;
}

#side-navi .side-info .popover-ticket .popover-content > ul li:last-child {
    border: 0;
}

#side-navi .side-info .popover-ticket .popover-content > ul li span {
    color: #56beee;
    float: right;
}

#side-navi .side-info .popover-ticket .popover-content > ul li span em {
    font-size: 13px;
    font-style: normal;
    font-weight: bold;
    padding-right: 2px;
}

#side-navi .side-info .popover-ticket .popover-content .ticket-buy {
   margin-top: 10px;
   text-align: center;
   font-size: 12px;
}

#side-navi .side-info .popover-ticket .popover-content .ticket-buy a {
   color: #000;
   text-decoration: underline;
}

/* ========================= side-base */
#side-navi .side-base, #side-navi .side-list {
    line-height: 14px;
    margin: 0 0 20px;
    border-radius: 5px;
    background: #56beee;
}

#side-navi .side-list{
   background: #ebeaea;
   border: 1px solid #cccccc;
}
#side-navi .side-base a {
    color: #fff;
}
#side-navi .side-base ul {
    overflow: hidden;
}
#side-navi .side-base ul.sb-main li {
    border-top: 1px #39a6e6 solid;
}
#side-navi .side-base ul.sb-main li a, #side-navi .side-list ul.sb-main li a{
    display: block;
    padding: 11px 12px;
    border-top: 1px #75cdf2 solid;
}
#side-navi .side-list ul.sb-main li a{
   border-top: 1px #cccccc solid;
   color: #666666;
}
#side-navi .side-base ul.sb-main li a:hover {
    background: #6bcdfa;
   text-decoration: none;
}
#side-navi .side-list ul.sb-main li a:hover{
   background: #f4f4f4;
   color:#1895ce;
   text-decoration: none;
 }
#side-navi .side-base ul.sb-main li:first-child, #side-navi .side-base ul.sb-main li:first-child a,#side-navi .side-list ul.sb-main li:first-child a {
    border-top: none !important;
}
#side-navi .side-base ul.sb-main li:first-child a:hover {
    border-radius: 5px 5px 0 0;
}
#side-navi .side-base ul.sb-main li:last-child a:hover {
    border-radius: 0 0 5px 5px;
}
#side-navi .side-info + .side-base {
    border-radius: 0 0 5px 5px;
}
#side-navi .side-info + .side-base ul.sb-main li:first-child {
    border-top: 1px #64a20b solid;
}
#side-navi .side-info + .side-base ul.sb-main li:first-child a {
    border-top: 1px #a5d523 solid;
}
#side-navi .side-info + .side-base ul.sb-main li:first-child a:hover {
    border-radius: 0;
}
#side-navi .side-base ul.sb-sub {
    line-height: 1.6;
    padding: 0 0 8px;
    border-top: 1px #39a6e6 solid;
}
#side-navi .side-base ul.sb-sub li:first-child {
    border-top: 1px #75cdf2 solid;
}
#side-navi .side-base ul.sb-sub li a {
    display: block;
    padding: 4px 12px 0;
}
#side-navi .side-base.member {
    background: #e6e6e6;
}
#side-navi .side-base.member ul.sb-main li {
    border-top: 1px #bcbcbc solid;
}
#side-navi .side-base.member ul.sb-main li a {
    border-top: 1px #eee solid;
}
#side-navi .side-base.member ul.sb-main li a:hover {
    background: #cbcbcb;
}
#side-navi .withdraw-wrap {
    float: right;
    font-size: 11px;
    margin: -13px 4px 9px 0;
}
#side-navi .withdraw-wrap a {
    border-bottom: 1px dotted #969696;
    color: #969696;
    padding-bottom: 1.5px;
    text-decoration: none;
}
/* ========================= sb-sub */
#side-navi .side-base ul li a span, #side-navi .side-list ul li a span {
    margin: 0 0 0 5px;
    padding: 1px 6px;
    border-radius: 30px;
    background: #f00;
    color: #fff;
    font-size: 10px;
}
#side-navi .side-list ul li a span{
   background: #56beee;
}
/* ========================= side-skype */
#side-navi .side-skype {
    margin: 0 0 20px 0;
    padding: 10px;
    border: 2px #e6e6e6 solid;
    border-radius: 3px;
    text-align: center;
}
#side-navi .side-skype p {
    margin: 0 0 4px;
}
#side-navi .side-skype .box-inquiry {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px #bbb dotted;
}
/* ========================= side-cancel */

#side-navi .side-cancel {
    overflow: hidden;
    margin: 20px 0 0;
    padding: 10px;
    border-radius: 5px;
    background: #262626;
    color: #fff;
    text-align: center;
}
/* ========================================================= [ #page ] */

#page {
    line-height: 1.4;
    padding: 15px 0 50px;
    background: #f7f7f7;
}
#page a {
    color: #333;
    text-decoration: none;
}
#page a

/*#page a {
color: #333;
text-decoration: none;
}

#page a:hover {
text-decoration: none;
}*/

#page h1,
#page h2 {
    line-height: 1;
}

#page a.bt-more {
    padding: 6px 15px 5px 30px;
    border-radius: 3px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/bg_more.png) no-repeat left center;
    color: #fff;
    text-decoration: none;
}
#page a.bt-more:hover {
    opacity: 0.7;
    -moz-opacity: 0.7;
    filter: alpha(opacity=70);
}
#page .bnr {
    margin: 80px 0 0;
    text-align: center;
}
/*=========== arrow css ==============*/
.arrow-right {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 8px;
    border-color: transparent transparent transparent #55ACEE;
}
/*============ popover =============*/

.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    max-width: 276px;
    padding: 1px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: left;
    white-space: normal;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
}

.popover.top {
    margin-top: -10px;
}

.popover.right {
    margin-left: 10px;
}

.popover.bottom {
    margin-top: 10px;
}

.popover.left {
    margin-left: -10px;
}

.popover-title {
    padding: 8px 14px;
    margin: 0;
    font-size: 14px;
    border-bottom: 1px solid #ebebeb;
    border-radius: 5px 5px 0 0;
}

.popover-content {
    padding: 9px 14px;
}

.popover > .arrow,
.popover > .arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}

.popover > .arrow {
    background: transparent !important;
    border-width: 11px;
}

.popover > .arrow:after {
    content: "";
    border-width: 10px;
}

.popover.top > .arrow {
    bottom: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-color: #999;
    border-top-color: rgba(0, 0, 0, .25);
    border-bottom-width: 0;
}

.popover.top > .arrow:after {
    bottom: 1px;
    margin-left: -10px;
    content: " ";
    border-top-color: #fff;
    border-bottom-width: 0;
}

.popover.right > .arrow {
    top: 50%;
    left: -11px;
    margin-top: -11px;
    border-right-color: #999;
    border-right-color: rgba(0, 0, 0, .25);
    border-left-width: 0;
}

.popover.right > .arrow:after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: #fff;
    border-left-width: 0;
}

.popover.bottom > .arrow {
    top: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-width: 0;
    border-bottom-color: #999;
    border-bottom-color: rgba(0, 0, 0, .25);
}

.popover.bottom > .arrow:after {
    top: 1px;
    margin-left: -10px;
    content: " ";
    border-top-width: 0;
    border-bottom-color: #fff;
}

.popover.left > .arrow {
    top: 50%;
    right: -11px;
    margin-top: -11px;
    border-right-width: 0;
    border-left-color: #999;
    border-left-color: rgba(0, 0, 0, .25);
}

.popover.left > .arrow:after {
    right: 1px;
    bottom: -10px;
    content: " ";
    border-right-width: 0;
    border-left-color: #fff;
}
/* ========================================================= [ #content ] */
#page #content {
    width: 730px;
    margin: 0 auto;
}
#page.area-flow #content {
    width: 670px;
    margin-bottom: 20px;
    padding: 0 30px 30px;
    border-radius: 5px;
    background: #fff;
    box-shadow: inset 0 0 4px rgba(0,0,0,0.3), 0 1px 0 #fff;
}

#w .banner_side {
    display: block;
    width: 730px;
    margin: 0 auto;
}
#w .banner_side02 {
    display: block;
    width: 1060px;
    margin: 0 auto;
}

#page.area-flow .withdrawal {
    width:730px;
    margin:-20px auto 0 auto;
    text-align:right;
}

#page #content input {
    margin: 7px 4px 0;
}
#d-ie7 #page #content input {
    margin: -1px 0 0;
}
#page #content textarea {
    resize: vertical;
    width: 98%;
    min-height: 100px;
    font-size: 14px;
}
#page #content table th, #page #content table td {
    text-align: left;
    vertical-align: top;
}
#page #content .area-sect {
    margin: 0 0 40px;
}
#page #content .area-sect .below_check {
    color: #666666;
}
#page #content .area-sect .attention_list {
    color: #666666;
}
#page #content .overview {
    max-height: 457px;
}
#page #content .bx-text,#page #content .bx-text02,#content .bx-text03 {
    margin: 0 0 20px;
    padding: 20px;
    background: #fff;
    text-align: center;
    line-height: 20px;
}
#page #content .bx-text a {
    display: block;
    margin-top: 10px;
    text-decoration: underline;
}
#page #content .bx-text02 {
    margin-left: 30px!important;
    margin-right: 30px!important;
}
#content .bx-text03 {
    font-size: 12px;
    line-height: 22px;
}
#content .bx-text03 a {
    color: #2FA6F5;
    text-decoration: underline;
}
#page #content .bx-text + .attention {
    text-align: center;
    line-height: 20px;
}

#page #content .tx-gray {
    color: #666;
}
#page #content div.portrait {
    width: 120px;
    margin: 0 6px;
    padding: 5px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
    text-align: center;
    opacity: 1.0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#page #content div.portrait a {
    color: #333;
    text-decoration: none;
    display: block;
}
#page #content div.portrait a.bookmark {
    background: #F990CF none repeat scroll 0% 0%;
    border: 1px solid #EC74BB;
    border-radius: 2px;
    color: #FFF;
    display: block;
    font-size: 11px;
    letter-spacing: 1px;
    text-decoration: none !important;
    padding: 3px 10px;
}
#page #content div.portrait a.registered {
    background: #EDEDED;
    color: #787878!important;
    font-weight: bold;
    border: 1px solid #B2B2B2;
}
#page #content div.portrait a.registered_on {
    font-weight: bold;
    background: #5A5A5A!important;
    color: #FFFFFF!important;
    border: 1px solid #4C4C4C!important;
}
#page #content div.portrait a:hover {
    text-decoration: none;
}
#page #content div.portrait span {
    display: block;
    line-height: 1.4;
    margin: 6px 0 0;
}
#page #content div.portrait > div {
    margin: 6px 0 0;
}
#page #content .linkarea {
    cursor: pointer;
}
#content .profile .area-bookmark a{
    background: #f990cf;
    /*background: -moz-linear-gradient(top, #f990cf 0%, #f873c1 100%);
    background: -webkit-linear-gradient(top, #f990cf 0%,#f873c1 100%);
    background: linear-gradient(to bottom, #f990cf 0%,#f873c1 100%);*/
    /*-webkit-box-shadow: inset 0px 1px 0px #fbbce2;
    -moz-box-shadow: inset 0px 1px 0px #fbbce2;
    box-shadow: inset 0px 1px 0px #fbbce2;*/
    border: 1px solid #ec74bb;
    border-radius: 2px;
    color: #ffffff;
    display: block;
    font-size: 11px;
    letter-spacing: 2px;
    /*text-shadow: 1px 1px 1px #ea5fac;*/
    text-decoration: none !important;
    padding: 3px 10px;
}
#download-audio{
    display:none;
    margin-top:10px;
}
/* ========================= headline */
#page.area-single #content h1,
#page.area-static #content h1,
#page.area-single #content .area-selecttype .area-find p:first-child {
    font-size: 36px;
}
#page.area-static #content h1,
#page.area-single #content .area-selecttype .area-find p:first-child {
    margin: 12px 0 30px;
    padding: 4px 0 0 0px;
    /*background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ico_h1.gif') no-repeat left top;*/
}

#page.area-single #content h1 {
    margin: 12px 0 15px;
}
#page.area-single #content h1 + p {
    margin-bottom: 15px;
}

#page.area-flow #content h1,
#page.area-flow #content .profile-withdrawal-title,
#page.area-single #content h2 {
    margin: 0 -30px 15px;
    padding: 10px 15px;
    border-top: 1px #60bfe9 solid;
    border-radius: 5px 5px 0 0;
    background: #60bfe9;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
}
#page.area-flow #content h2 {
    margin: 0 0 12px;
    padding: 0 0 0 16px;
}
#page.area-flow #content h2 img {
    vertical-align: middle;
}
/* ========================= table.form */
#page #content table.form {
    width: 100%;
    line-height: 2;
    margin: 0 auto 15px;
    border: none;
    border-collapse: separate;
    border-spacing: 8px;
}
#page #content table.form th {
    width: 25%;
    background: #efefef;
    font-weight: normal;
    line-height: 1.6;
}
#page #content table.form th .text_red {
    color: #f00;
    font-size: 11px;
}
#page #content table.form th, #page #content table.form td {
    padding: 10px;
}
#page #content table.form td a {
    text-decoration: underline;
}
#page #content table.form td ul {
    overflow: hidden;
}
#page #content table.form td ul li {
    float: left;
    margin-right: 20px;
    white-space: nowrap;
}
#page #content table.form td img {
    margin: 10px 0 0;
}
#page #content table.form td input, #page #content table.form td select {
    margin: 2px 4px 2px 0;
    padding: 5px;
}
#page #content table.form td input[type=radio], #page #content table.form td input[type=checkbox] {
    margin: 2px 4px;
    padding: 5px;
}
#page #content table.form td .material01 {
    float: right;
    width: 170px;
}
#page #content table.form td .material02 {
    float: right;
    width: 200px;
}
#page #content table.form td ul li label {
    padding: 3px 6px 3px 0;
}
#page #content table.form td ul li label.flL {
    float: left;
}
/*skype msg*/
ul.skype-link li {
    float: none!important;
    line-height: 1.7;
}
ul.skype-link li::before {
    content: '- ';
}
ul.skype-link li a {
    font-size: 13px;
    color: #2FA6F5!important;
    text-decoration: underline!important;
}
ul.skype-link li a strong {
    font-size: 17px;
}
.box-skype-test-inner{
    display: block;
    text-align: center;
    border: solid 1px #e6e6e6;
    padding: 15px;
    margin: 15px 0;
}
.box-skype-test-inner a {
    text-decoration: none!important;
}
.box-skype-test-inner .ttl{
    display: block;
    font-size: 13px;
    line-height: 19px;
    letter-spacing: 1px;
    font-weight: bold;
    text-align: center;
}
.box-skype-test-inner .btn-skype{
    display: inline-block;
    width: 314px;
    height: 52px;
    line-height: 52px;
    background: #29b1eb;
    vertical-align: middle;
    color: #FFFFFF!important;
    border-radius: 52px;
    margin: 10px 0;
}
.box-skype-test-inner .btn-skype img{
    display: inline-block;
    position: relative;
    width: 34px;
    vertical-align: middle;
    margin: 0!important;
}
.box-skype-test-inner .btn-skype span{
    display: inline-block;
    line-height: 1.2;
    margin: 0;
    vertical-align: middle;
}
.box-skype-test-inner .btn-skype span strong {
    font-size: 16px;
}
.box-skype-test-inner p{
    margin: 0 0 10px 0;
    line-height: 1.7;
    text-align: left;
}
.error-msg {
    position: relative;
    margin-top: 10px;
    padding: 5px 8px 6px 8px;
    background: #ff0000;
    text-align: center;
    font-weight: bold;
    color: #fff;
}
.error-msg:after {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(255, 0, 0, 0);
    border-bottom-color: #ff0000;
    border-width: 5px;
    margin-left: -5px;
}
.error-msg .error-msg-skype {
    margin-top: 9px;
    padding: 10px;
    background: #fff;
    text-align: left;
    font-weight: normal;
    color: #333;
    line-height: 1.7;
}
.error-msg .error-msg-skype p {
    margin-top: 7px!important;
    text-align: center;
    font-weight: bold;
    line-height: 16px;
}
.error-msg .error-msg-skype p a {
    display: block;
    margin-top: 7px!important;
    font-size: 15px;
    text-decoration: underline!important;
    color: #2FA6F5!important;
}
/* ========================= table.form ver area-single02 */

#page.area-single02 #content table.form {
    width: 100%;
    line-height: 2;
    margin: 0 auto 15px;
    border: none;
    border-collapse: separate;
    border-spacing: 8px;
}

#page.area-single02 #content table.form th {
    width: 25%;
    font-size: 18px;
    font-weight: normal;
    text-align: left;
    line-height: 32px;
}

#page.area-single02 #content table.form th,
#page.area-single02 #content table.form td {
    padding: 10px;
}
#page.area-single02 #content h1 + p {
    font-size: 15px;
}
#page.area-single02 #content .bx-text {
    font-size: 14px;
    line-height: 23px;
}
#page.area-single02 #content .bx-text a {
    text-decoration: underline;
    color: #2FA6F5;
}
#page.area-single02 #content .bx-text a.inquire_link {
    display: inline-block;
    padding-top: 10px;
    color: #000000;
}
#page.area-single02 #content .bx-text + .attention {
    font-size: 12px;
    line-height: 22px;
    text-align: center;
}
#page.area-single02 #content .area-inquiryform table th {
    position: relative;
}
#page.area-single02 #content .area-inquiryform table td {
    position: relative;
    padding-left: 0;
    padding-right: 0;
}
#page.area-single02 #content .area-inquiryform table th.none {
    opacity: 0.3;
}
#page.area-single02 #content .area-inquiryform table .td_bg::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.7;
    background: #FFF;
    border: none;
}
#page.area-single02 #content .area-inquiryform table td .bg_g {
    background: #CCCCCC;
}
#page.area-single02 #content .area-inquiryform table td .qa p:nth-of-type(1) {
    font-weight: bold;
    color: #FF0000;
}
#page.area-single02 #content .area-inquiryform table td .qa a {
    display: inline-block;
    text-decoration: underline;
    padding-left: 21px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/question.png) no-repeat;
    background-position: left 4px;
    margin-top: 5px;
}
#page.area-single02 #content .area-inquiryform table td textarea {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    line-height: 22px;
    letter-spacing: 1.2px;
}
#page.area-single02 #content .area-inquiryform table td textarea + p {
    font-size: 12px;
    padding-top: 5px;
    text-align: right;
}
#page.area-single02 #content .area-inquiryform .send_inquiry {
    text-align: center;
}
#page.area-single02 #content .area-inquiryform .send_inquiry input {
    display: inline-block;
}
#page.area-single02 #content .area-inquiryform .send_inquiry a {
    display: inline-block;
    padding-top: 10px;
    text-decoration: underline;
}
#page.area-single02 #content table.form td ul {
    overflow: hidden;
}

#page.area-single02 #content table.form td ul li {
    float: left;
    margin-right: 20px;
    white-space: nowrap;
}

#page.area-single02 #content table.form td img {
    margin: 10px 0 0;
}

#page.area-single02 #content table.form td input,
#page.area-single02 #content table.form td select {
    margin: 2px 4px;
    vertical-align: -2px;
}

#page.area-single02 #content table.form td ul li label {
    padding: 3px 6px 3px 0;
}
/* ========================= div.confirm */
#page #content div.confirm {
    border-top: 1px #474747 solid;
}
#page #content div.confirm dl {
    padding: 4px 0;
    border-bottom: 1px #474747 solid;
}
#page #content div.confirm dl dt {
    float: left;
    width: 160px;
    padding: 10px;
    background: #474747;
    color: #fff;
}
#page #content div.confirm dl dd {
    margin: 0 0 0 180px;
    padding: 10px;
}
#page #content div.confirm dl dd p.nts {
    padding-top: 16px;
}
/* ==================== div.confirm.low */
#page #content div.confirm.low {
    border-top: 1px #c7c7c7 solid;
}
#page #content div.confirm.low dl {
    border-bottom: 1px #c7c7c7 solid;
}
#page #content div.confirm.low dl dt {
    background: #efefef;
    color: #333;
}
/* ========================= .nav-date */
#page #content .nav-date {
    margin-bottom: 20px;
    text-align: center;
}
#page #content .nav-date * {
    vertical-align: middle;
}
#page #content .nav-date .date {
    padding: 0 20px;
    font-size: 18px;
    font-weight: bold;
}
/* ========================= .area-course */
#page #content .area-course {
  overflow: hidden;
}
#page #content .area-course div[class^="sect-"] {
    margin-bottom: 30px;
}
#page #content .area-course div[class^="sect-"] li {
    position: relative;
    padding: 26px 0 26px 125px;
    border-top: 1px #555 dotted;
}
#page #content .area-course div[class^="sect-"] li:first-child {
    border-top: none;
}
#page #content .area-course div[class^="sect-"] li p:first-child {
    margin-bottom: 5px;
}
#page #content .area-course div[class^="sect-"] li span.bt {
    position: absolute;
    top: 12px;
    right: 0;
    padding: 36px 10px;
    border-radius: 5px;
    background: #faf9e1;
}
#page #content .area-course div[class^="sect-"] li span.bt.sm {
    padding: 36px 10px;
}
#page #content .area-course div[class^="sect-"] li span.bt.la {
    padding: 74px 10px;
}
#page #content .area-course div[class^="sect-"] li .comment {
    width: 370px;
    padding: 5px;
    overflow: hidden;
    border-radius: 5px;
    background: #ebebeb;
    white-space: nowrap;
}
#page #content .area-course div[class^="sect-"] li p.comment + p {
    width: 378px;
    text-align: right;
}
#page #content .area-course div.sect-freetrial li {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/course/fig_freetrial.png) no-repeat left center;
}
#page #content .area-course div.sect-everyday li {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/course/fig_everyday_1.png) no-repeat left 30px;
}
#page #content .area-course div.sect-everyday li + li {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/course/fig_everyday_2.png) no-repeat left center;
}
#page #content .area-course div.sect-everyday li + li + li {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/course/fig_everyday_3.png) no-repeat left center;
}
#page #content .area-course .nts {
    margin-top: 30px;
    margin-left: 1em;
    text-indent: -1em;
}
#page.area-single #content .area-course div[class^="sect-"],
#page.area-single #content .area-inquirylist,
#page.area-single #content .area-inquiryexchange,
#page.area-single #content .area-inquiryform,
#page.area-static #content .sect-box {
    margin-bottom: 40px;
    padding: 0 30px 20px;
    border-radius: 10px!important;
    background: #fff;
}
#page.area-single #content h2 {
    margin-left: 0;
    margin-right: 0;
    border-radius: 10px 10px 0 0;
}
#page.area-single #content .area-inquiryform,#page.area-single #content .area-inquiryexchange,#page.area-single #content .area-inquirylist {
    padding-left: 0;
    padding-right: 0;
}
#page.area-single #content .area-inquiryform > p {
    padding: 5px 0;
}
#page.area-single #content .area-inquiryform > p,#page.area-single #content .area-inquiryform table {
    width: 695px;
    margin: 0 auto;
}
#page.area-single #content .area-inquiryform table {
    border-spacing: 0;
}

#page.area-single #content .area-inquiryform table tr th {
    width: 145px;
    padding-left: 0;
    padding-right: 0;
    padding-top: 20px;
    font-weight: bold;
}
#page.area-single02 #content .area-inquiryform table tr th {
    background: none;
}

#page.area-single #content .area-inquiryform table tr td select {
    width: 100%;
    height: 45px;
    font-size: 14px;
    box-sizing: border-box;
    padding: 0 10px;
    border: 1px solid #CCCCCC;
    margin-left: 0;
    background: #FFFFFF;
}

#page.area-single #content .area-inquiryform table tr td .attention {
    display: none;
    color: #FF0000;
    font-size: 12px;
    line-height: 18px;
    padding-top: 10px;
}

#page.area-single #content .area-inquiryform table tr td div {
    padding: 10px;
    border: 1px solid rgb(169, 169, 169);
}

#page.area-single #content .area-inquiryform table tr td div > * {
    font-size: 14px;
    line-height: 22px;
}
#page.area-single #content .area-course div[class^="sect-"] {
    padding: 0 30px;
}
#page.area-single #content .area-course div[class^="sect-"] ul {
    margin: -30px 0 0;
    padding: 5px 0;
}
#page.area-single #content div.sect-freetrial h2 {
    border-top: 1px #ffa300 solid;
    background: #ffba00;
}
#page.area-single #content .area-course .bnr-cp {
    margin: -10px 0 25px;
}
#page #content .area-course p.notes {
    margin: 20px 0 0 -125px;
}
#page #content .area-course-top h1{
   background: none;
   font-size: 53px;
}
#page #content .area-course .course-price{
  float: left;
  margin-right: 11px;
}
#page #content .area-course .course-price:hover{
  opacity: 0.7;
}
#page #content .area-course .course-price:last-child{
  margin-right: 0;
}
/* ========================= div.area-lesson */

#page #content div.area-lesson {
    position: relative;
    margin: 0 0 30px;
}
#page #content div.area-lesson.r_tickets::after {
    content: '';
    width: 95px;
    height: 95px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/evalute_teacher/pc_ticket.png) no-repeat;
    background-size: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
#page #content div.area-lesson.n_tickets::after {
    content: '';
    width: 95px;
    height: 95px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/evalute_teacher/pc_native_ticket.png) no-repeat;
    background-size: 100%;
    position: absolute;
    left: 0;
    top: 0
}

.book_id #content div.area-lesson {
    border: 1px #E0E0E0 solid;
}
#page #content div.area-lesson > ul {
    margin: 0 0 40px;
    border-radius: 5px;
}

.book_id #content div.area-lesson > ul {
    margin-bottom: 0!important;
    border-top: 1px solid #eee;
}


#page #content div.area-lesson .t_time {
    position: relative;
    width: 100%;
    height: 50px;
    font-size: 24px;
    font-weight: bold;
    line-height: 50px;
    letter-spacing: 1px;
    color: #1BABEE;
    background: #FFFFFF;
    padding-left: 20px;
    box-sizing: border-box;
    border-radius: 5px 5px 0 0;
}

#page #content div.area-lesson.r_tickets .t_time,#page #content div.area-lesson.n_tickets .t_time {
    padding-left: 80px;
}


#page #content div.area-lesson > ul > li:first-child {
    zoom: 1;
    /*border-top: none;*/
}

.list-lesson #content div.area-lesson > ul > li,.list-history #content div.area-lesson > ul > li {
    border: 1px #E0E0E0 solid;
}

#page #content div.area-lesson > ul > li.r_tickets::after {
    content: '';
    width: 95px;
    height: 95px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/evalute_teacher/pc_ticket.png) no-repeat;
    background-size: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

#page #content div.area-lesson > ul > li.n_tickets::after {
    content: '';
    width: 95px;
    height: 95px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/evalute_teacher/pc_native_ticket.png) no-repeat;
    background-size: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
}

#page #content div.area-lesson > ul > li {
    position: relative;
    /*margin-top: 30px;*/
    background: #eee;
    z-index: 10;
}
#page #content div.area-lesson > ul > li > .bx-bg {
    background: #eee;
}

#page #content div.area-lesson > ul > li > .choose_btn {
    width: 100%;
    padding: 20px 0;
    text-align: center;
    background: #FFFFFF;
    border-top: solid 1px #E0E0E0;
    box-sizing: border-box;
    text-align: center;
}
#page #content div.area-lesson > ul > li > .choose_btn dl {
    display: inline-block;
}
#page #content div.area-lesson > ul > li > .choose_btn dl dt a,#page #content div.area-lesson > ul > li > .choose_btn > a {
    display: block;
    width: 280px;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    letter-spacing: 1px;
    font-weight: bold;
    border-radius: 20px;
    text-align: center;
    box-sizing: border-box;
}
#page #content div.area-lesson > ul > li > .choose_btn > a {
    display: inline-block;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.change a {
    color: #1BABEE;
    border: 2px solid #1BABEE;
    line-height: 39px;
}
#page #content div.area-lesson > ul > li > .choose_btn > a.evalute {
    background: #FD8424;
    color: #FFFFFF;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.evaluation {
    width: 100%;
    padding: 0 25px;
    box-sizing: border-box;
    text-align: left;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.evaluation dt {
    font-size: 19px;
    line-height: 26px;
    color: #2E2E2E;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.evaluation dt .stars {
    display: inline-block;
    margin-left: 15px;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.evaluation dt .stars li {
    display: inline-block;
    width: 25px;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.evaluation dt .stars li img {
    width: 100%;
    vertical-align: top;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.evaluation dt .stars li ~ li {
    padding-left: 2px;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.evaluation dd {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 21px;
    padding: 10px 15px;
    box-sizing: border-box;
    background: #F5F5F5;
    color: #2E2E2E;
    border-radius: 5px;
    margin-top: 15px;
}

#page #content div.area-lesson > ul > li > .choose_btn dl:nth-of-type(2) {
    margin-left: 25px;
}
#page #content div.area-lesson > ul > li > .choose_btn dl.cancel a {
    color: #373737;
    background: #EEEEEE;
}
#page #content div.area-lesson > ul > li > .choose_btn dl dd {
    font-size: 12px;
    line-height: 12px;
    color: #5C5C5C;
    padding-top: 10px;
}
#page #content div.area-lesson > ul > li > .choose_btn dl dd .red {
    color: #FF0000!important;
}

#page #content div#lessonHistory > ul.none-lesson,
#page #content div#reserveList > ul.none-lesson {
    background: #fff;
}

#page #content div#lessonHistory > ul.none-lesson > li,
#page #content div#reserveList > ul.none-lesson > li {
    padding: 60px 0;
    text-align: center;
}
#page #content div#lessonHistory > ul.none-lesson > li > p,
#page #content div#reserveList > ul.none-lesson > li > p {
    margin: 0 0 12px;
    font-size: 16px;
}
#page #content div.area-lesson > ul > li > dl.ico-good {
    background: #fff url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/ico_good.png) no-repeat right top;
}
#page #content div.area-lesson > ul > li.ico-bad {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/ico_bad.png) no-repeat right top;
}
#page #content div.area-lesson > ul > li > form {
    margin: 0;
}

#page #content div.area-lesson > ul > li ~ li {
    margin-top: 50px;
}

#page #content div.area-lesson > ul > li .l_time {
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 1px;
    color: #1BABEE;
    border-bottom: solid 1px #E0E0E0;
    background: #FFFFFF;
    padding-left: 25px;
    box-sizing: border-box;
}

#page #content div.area-lesson > ul > li.r_tickets .l_time,#page #content div.area-lesson > ul > li.n_tickets .l_time {
    padding-left: 100px;
}

#page #content div.area-lesson > ul > li .l_time .lesson_note {
    display: inline-block;
    width: 140px;
    height: 30px;
    font-size: 12px;
    line-height: 30px;
    letter-spacing: 0;
    text-align: center;
    border-radius: 20px;
    background: #1BABEE;
    color: #FFFFFF;
    float: right;
    margin: 10px 10px 0 0;
}

#page #content div.area-lesson div.bx-l {
    float: left;
    padding: 19px;
    text-align: center;
    background: #eee;
}
#page #content div.area-lesson div.bx-l a.skype-call
{
    text-decoration: none;
}
#page #content div.area-lesson div.bx-l a.skype-call:hover .btn-skype-lect
{
    opacity: .7;
}
#page #content div.area-lesson div.bx-l a.skype-call.disabled .btn-skype-lect
{
    background: #666666;
    border-bottom-color: #555555;

}
#page #content div.area-lesson .bx-r dd {
    overflow: hidden;
}
#page #content div.area-lesson div.bx-l a.skype-call.disabled .btn-skype-lect small
{
    color: #666666;
}
#page #content div.area-lesson div.bx-l a.skype-call.disabled .btn-skype-lect small span
{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ico_skype_disabled.png') no-repeat;
}
#page #content div.area-lesson div.bx-l a.skype-call.disabled:hover .btn-skype-lect
{
    opacity: 1;
}
#page #content div.area-lesson div.bx-l a.skype-call.disabled,
#page #content div.area-lesson div.bx-l a.skype-call.disabled:hover
{
    cursor: default;
    pointer-events:none;
}
#page #content div.area-lesson div.bx-l .btn-skype-lect {
    background: #1daef0;
    border-bottom: 3px solid #1683b4;
    border-radius: 3px;
    color: #fff;
    display: block;
    font-weight: normal;
    line-height: 15px;
    margin: 13px 4px 0;
    padding: 6px 4px 4px;
    text-align: center;
    width: 128px;
    word-break: break-all;
}

#page #content div.area-lesson div.bx-l .btn-skype-lect small {
    background: #ffffff;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    color: #1daef0;
    display: block;
    font-size: 10.6px;
    font-weight: normal;
    letter-spacing: 0;
    line-height: 16px;
    margin-top: 3px;
    padding: 5px 0;
    text-align: left;
}

#page #content div.area-lesson div.bx-l .btn-skype-lect small span {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ico_skype.png') no-repeat;
    display: block;
    float: left;
    height: 16px;
    left: 3px;
    margin-right: 5px;
    position: relative;
    width: 15px;
}
/*************added skype css***************/
#page #content div.area-lesson .box-skype-explain{
    margin: 10px 0;
}
#page #content div.area-lesson .bx-r div.request .box-skype-explain p{
    margin-bottom: 5px;
    line-height: 1.6;
}
#page #content div.area-lesson .box-skype-explain img{
    width: 340px;
    margin: 6px 0 15px 0;
}
#page #content div.area-lesson .box-skype-test{
    display: block;
}
#page #content div.area-lesson .box-skype-test-inner{
    display: block;
    text-align: center;
    border: solid 1px #e6e6e6;
    padding: 20px 10px 10px 10px;
    margin: 0 0 15px 0;
}
#page #content div.area-lesson .bx-r div.request .box-skype-test .ttl{
    display: block;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    letter-spacing: -1px;
}
#page #content div.area-lesson .box-skype-test .btn-skype{
    display: inline-block;
    width: 314px;
    height: 52px;
    line-height: 52px;
    background: #29b1eb;
    vertical-align: middle;
    color: #FFFFFF;
    border-radius: 52px;
    margin: 0 0 15px 0;
}
#page #content div.area-lesson .box-skype-test .btn-skype img{
    display: inline-block;
    position: relative;
    width: 34px;
    vertical-align: middle;
    margin: -1px 0 0 0 ;
}
#page #content div.area-lesson .bx-r div.request .box-skype-test .btn-skype span{
    display: inline-block;
    line-height: 1.2;
    margin: 0;
    vertical-align: middle;
}
#page #content div.area-lesson .bx-r div.request .box-skype-test p{
    margin: 0 0 10px 0;
    line-height: 1.6;
}
#page #content div.area-lesson .skype-form input[type="text"]{
    height: 25px;
    width: 165px;
    border: solid 1px #ABABAB;
    padding: 5px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lesson .box-skype-test .btn-skype span > strong{
    font-size: 16px;
}
#page #content div.area-lesson .box-skype-test .btn-skype span > small{
    display: block;
    font-size: 11px;
    letter-spacing: 1px;
}
#page #content div.area-lesson .box-skype-test .txt{
    text-align: left;
}
#page #content div.area-lesson .box-skype-test a.to-skype-guide{
    display: block;
    text-align: left;
    color: #1166C3;
    text-decoration: underline;
    font-size: 15px;
}
#page #content div.area-lesson .box-gender{

}
#page #content div.area-lesson .bx-r div.request table.form .box-gender td ul li{
    display: inline-block;
    float: left;
    margin: 0 40px 0 0;
}
#page #content div.area-lesson .bx-r div.request table.form .box-gender td ul li:last-child{
    margin: 0;
}
#page #content div.area-lesson .bx-r div.request table.form .box-birth td ul li{
    display: inline-block;
    float: left;
    width: 110px;
}
#page #content div.area-lesson .bx-r div.request table.form .box-birth td ul li:last-child{
    margin: 0;
}
#page #content div.area-lesson .box-birth .regular-select select {
    width: 120%;
    padding: 0 0 0 .6em;
    line-height: 35px;
    height: 35px;
    border: 0;
    outline: 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/regist/ico_select_black.png) no-repeat 60px center;
    background-size: 11px 20px;
}
#page #content div.area-lesson .box-birth .regular-select {
    display: inline-block;
    border: #ccc 1px solid;
    position: relative;
    width: 80px;
    overflow: hidden;
    margin: 0 6px 0 0;
    vertical-align: middle;
}
#page #content div.area-lesson .box-birth ul li { float: left; }
#page #content div.area-lesson .box-birth ul li + li { margin-left: 10px; }
#page #content div.area-lesson .box-birth ul li span {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}
#page #content div.area-lesson .txt-req{
    font-size: 10px;
    color: #FF0000;
    margin-left: 4px;
    white-space: nowrap;
}
#page #content div.area-lesson .btn-wrap{
    display: block;
    text-align: center;
}

#page #content .btn-reserve input[type=button],
#page #content .btn-edit-reserve input[type=button]{
    display: block;
    height: 55px;
    width: 290px;
    line-height: 55px;
    font-size: 20px;
    font-weight: bold;
    color: #FFFFFF;
    background: #fe7821;
    border: 0;
    border-radius: 4px;
    letter-spacing: 2px;
    cursor: pointer;
    font-family:"メイリオ",sans-serif;
    padding: 0;
    margin: 0 auto;
}
#page #content div.area-lesson .box-skype-test .btn-skype:hover,
#page #content div.area-lesson .btn-reserve input[type=button]:hover,
#page #content div.area-lesson .btn-edit-reserve input[type=button]:hover{
    opacity: .7;
}



#page #content div.area-lesson .msg-box{
    display: block;
    border: solid 1px #FF0000;
    color: #FF0000;
    text-align: center;
    padding: 8px 0;
    margin: 0 0 8px 0;
    font-weight: bold;
}
#page #content div.area-lesson .msg-box02{
    display: block;
    color: #FF0000;
    text-align: center;
    padding: 8px 0;
    margin: 0 0 8px 0;
    font-weight: bold;
}
#page #content div.area-lesson .msg-box02 small{
    font-size: 10px;
    color: #FF0000;
}
#page #content div.area-lesson .border_wrap {
    border: 1px solid #FF0000;
}
#page #content div.area-lesson .border_wrap table:first-of-type {
    padding: 0 5px 5px;
}
#page #content div.area-lesson .bx-r {
    position: relative;
    min-height: 172px;
    margin: 0 0 0 182px;
    padding: 18px 20px;
    background: #fff;
}
.book_id .bx-r {
    margin-left: 169px!important;
}
#page #content div.area-lesson .bx-r.i-good::after {
    content: '';
    width: 54px;
    height: 54px;
    position: absolute;
    right: 0;
    top: 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general//eikaiwa/lesson/ico_good.png);
    background-size: 100%;
    z-index: 10;
}

#page #content div.area-lesson .bx-r > dt {
    margin-bottom: 12px;
    font-size: 15px;
    font-weight: bold;
    vertical-align: middle;
    z-index: 20;
}
#page #content div.area-lesson .bx-r > dt > img{
    display: inline-block;
    vertical-align: middle;
    margin: 0 12px 0 0;
}

#page #content div.area-lesson .bx-r dt .label {
    margin: 0 7px 0 0;
    vertical-align: middle;
}

#page #content div.area-lesson .bx-r div.request > p {
    color: #333333;
    font-size: 12px;
    margin: 10px 0;
}

.book_id #content div.area-lesson > ul li p:first-of-type {
    margin-top: 0!important;
}

.book_id #content div.area-lesson > ul li p.red {
    color: #FF0000!important;
}

#page #content div.area-lesson .bx-r div.request table.form td ul li {
    float: none;
    margin: 0 0 5px 0;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei {
    display: none;
    margin-top: 15px;
    padding: 8px 8px 0;
    border: 1px #dbdbdb solid;
    border-radius: 6px;
    box-sizing: border-box;
    width: 100%;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei .ttl {
    font-weight: bold;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei .ttl_disabled {
    font-weight: bold;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dt.btn_teikei {
    position: relative;
    margin: 0 0 10px;
    padding: 6px 8px;
    background: #eee;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.88, #d4d4d4), color-stop(0.00, #fff));
    background: -webkit-linear-gradient(top, #fff 0%, #eee 88%);
    background: -moz-linear-gradient(top, #fff 0%, #eee 88%);
    background: -ms-linear-gradient(top, #fff 0%, #eee 88%);
    background: linear-gradient(to bottom, #fff 0%, #eee 88%);
    border: 1px #bbb solid;
    border-radius: 6px;
    font-size: 12px;
    height: 24px;
    cursor: pointer;
    overflow: hidden;
}
#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dt.btn_teikei_disabled {
    position: relative;
    margin: 0 0 6px;
    padding: 6px 8px;
    background: #eee;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.88, #d4d4d4), color-stop(0.00, #fff));
    background: -webkit-linear-gradient(top, #fff 0%, #eee 88%);
    background: -moz-linear-gradient(top, #fff 0%, #eee 88%);
    background: -ms-linear-gradient(top, #fff 0%, #eee 88%);
    background: linear-gradient(to bottom, #fff 0%, #eee 88%);
    border: 1px #bbb solid;
    border-radius: 6px;
    font-size: 12px;
    height: 24px;
    opacity: 0.7;
    overflow: hidden;
}
#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dt.btn_teikei:after {
    position: absolute;
    top: 16px;
    right: 8px;
    content: "";
    display: inline-block;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 7px 5px 0 5px;
    border-color: #000 transparent transparent transparent;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dt.btn_teikei.on:after {
    border-width: 0 5px 7px 5px;
    border-color: transparent transparent #000 transparent;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dt.btn_teikei:hover {
    opacity: 0.7;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dd {
    display: none;
    margin: 6px 6px 12px;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dd p {
    margin-top: 10px;
    padding-top: 10px;
    line-height: 19px;
    border-top: 1px dashed #ddd;
}

#page #content div.area-lesson .bx-r div.request table.form td .box-teikei dl dd select {
    max-width: 250px;
}

#page #content div.area-lesson .bx-r dd div.memo {
    margin: 0 0 29px;
    padding: 0 10px 10px;
    ;
    border-radius: 5px;
    background: #f3f3f3;
    /*box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);*/
}

#page #content div.area-lesson .bx-r dd div.memo p {
    margin: 0 -10px 10px;
    ;
    padding: 10px;
    border-radius: 5px 5px 0 0;
    background: #e3e3e3;
}
/* ========================= area-rating */
#page div.area-rating {
    position: relative;
    margin: 12px 0 0;
}
#d-ie7 #page div.area-rating {
    width: 120px;
    z-index: 20;
}
#page div.cover {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    background: none;
}
#page div.area-rating .wrap {
    display: none;
    position: absolute;
    top: 48px;
    left: 0;
    z-index: 50;
    width: 408px;
    padding: 20px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.3);
}
#page div.area-rating .wrap .top_triangle {
    position: absolute;
    top: -21px;
    left: -2px;
    z-index: 100;
}
#page div.area-rating .wrap .top_triangle img {
    width: 50%;
}

#d-ie7 #page div.area-rating .wrap {
    position: relative;
    margin: -30px 0 0;
}
#page div.area-rating .wrap .inner {
    text-align: center;
}
#page div.area-rating .wrap .fig-arrow {
    position: absolute;
    top: -12px;
    left: 72px;
    z-index: 100;
}
#page div.area-rating .wrap .bt-close {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 100;
}

#page div.area-rating .wrap .collapse{
    overflow: hidden;
}
#page div.area-rating .wrap .collapse h4{
    background: #efefef;
    cursor: pointer;
    font-size: 11px;
    margin-bottom: 0;
    padding: 10px 7px;
    text-align: left;
}
#page div.area-rating .wrap .collapse .arrow-down{
    margin-right: 7px;
    vertical-align: baseline;
}
#page div.area-rating .wrap .sect .collapse .checkbox{
    border-bottom: 1px solid #ebebeb;
    display: block;
    font-size: 11px;
    padding-left: 10px;
}

#page div.area-rating .wrap .collapse input{
    margin-right: 10px;
    vertical-align: middle;
}
#page div.area-rating .wrap .collapse .collapse-content{
    text-align: left;
}

#page div.area-rating .capt {
    margin: 0 0 6px;
    font-size: 14px;
    text-align: left;
}
#page div.area-rating .capt span {
    font-size: 18px;
    font-weight: bold;
}
#page div.area-rating .sect textarea {
    min-height: 80px;
    width: 99%;
}
#page div.area-rating .sect ul.set {
    overflow: hidden;
    margin: 6px auto 5px;
}
#page div.area-rating .sect ul.set li {
    float: left;
}
#page div.area-rating .sect label {
    display: inline-block;
    cursor: pointer;
    margin: 0;
    padding: 10px 30px 8px 0px;
}
#page div.area-rating .sect p.caution {
    margin-bottom: 10px;
}
#page div.area-rating .sect .bt-good {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/ico_goodface.png) no-repeat right;
    color: #00a5db;
}
#page div.area-rating .sect .bt-bad {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bt_bad.png) no-repeat center center;
}
/* ========================= div.area-lessonnote */

#page #content div.area-lessonnote {
    overflow: hidden;
}

#page #content div.area-lessonnote a:hover{
    opacity: .7;
}

#page #content div.area-lessonnote .date {
    display: block;
    background: #5FC0EA;
    height: 64px;
    line-height: 64px;
    margin: 0 0 20px 0;
    font-size: 30px;
    padding: 0;
    vertical-align: middle;
}

#page #content div.area-lessonnote .date .date-txt p{
    float: left;
    width: 600px;
    height: 64px;
    line-height: 64px;
    color: #FFFFFF;
    font-weight: bold;
    text-align: center;
    font-size: 28px;
}

#page #content div.area-lessonnote .date .date-txt p span {
    margin-left: 10px;
}

#page #content div.area-lessonnote .date .btn-date {
    display: inline-block;
    height: 64px;
    width: 64px;
    text-align: center;
    vertical-align: middle;
}

#page #content div.area-lessonnote .date .btn-date a {
    text-decoration: none;
    display: inline-block;
    position: relative;
    background: #FFFFFF;
    height: 36px;
    width: 36px;
    line-height: 36px;
    border-radius: 36px;
    vertical-align: middle;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .date .btn-date a.disabled{
    pointer-events: none;
    opacity: .3;
    cursor: default;
}
#page #content div.area-lessonnote .date .btn-date a > i {
    display: inline-block;
    height: 16px;
    position: absolute;
    top: 10px;
    left: 14px;
    width: 8px;
}
#page #content div.area-lessonnote .date .btn-date a:hover {
    opacity: 0.7;
    color: #333;
}
#page #content div.area-lessonnote .date .btn-date .caret-right:before {
    border-left: 8px solid #5fc0ea;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
}

#page #content div.area-lessonnote .date .btn-date .caret-right:after {
    border-left: 6px solid #FFFFFF;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}
#page #content div.area-lessonnote .date .btn-date .caret-left:before {
    border-right: 8px solid #5fc0ea;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
}

#page #content div.area-lessonnote .date .btn-date .caret-left:after {
    border-right: 6px solid #FFFFFF;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}

#page #content div.area-lessonnote .contents_side {
    float: left;
}
#page #content div.area-lessonnote .portrait{
    background: #FFFFFF;
    margin: 0;
    width: 140px;
    text-align: center;
    padding: 10px;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    border: solid 1px #E3E3E3;
    border-radius: 8px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .portrait:hover{
    opacity: 1.0;
}
#page #content div.area-lessonnote .portrait .btn-wrap{
    display: block;
    text-align: center;
    margin: 10px 0 0 0;
}
#page #content div.area-lessonnote .portrait .bt-rating{
    display: inline-block;
    height: 32px;
    line-height: 32px;
    width: 94px;
    background: #eee;
    border: 1px solid #ddd;
    border-radius: 3px;
    text-decoration: none;
    font-size: 12px;
}
#page #content .portrait p.from img {
    float: left;
    width: 20px;
}

#page #content .portrait p.from {
    font-size: 9px;
}

#page #content .portrait p.from span.countryname {
    padding: 0 20px;
    height: 20px;
}

#page #content div.area-lessonnote .contents_side dl {
    width: 135px;;
    line-height: 1.7;
}
#page #content div.area-lessonnote .contents_side dt{
    padding: 15px 0 0 0;
}
#page #content div.area-lessonnote .contents_side dd {
    border-bottom:1px dotted #B8B8B8;
    font-size: 12px;
    word-break: break-all;
}
#page #content div.area-lessonnote .contents_side dd:last-child{
    border: 0;
}

#page #content div.area-lessonnote p.rating_img {
    margin: 12px 0;
    text-align: center;
}

#d-ie7 #page #content div.area-lessonnote p.rating_img {
    margin: 12px 20px;
    text-align: center;
}

#page #content div.area-lessonnote div.area-rating p.bt_rating {
    text-align: center;
}

#page #content div.area-lessonnote div.area-rating p.bt_rating a {
    background: #eee;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 7px;
    text-decoration: none;
    opacity: 1.0;
}

#page #content div.area-lessonnote div.area-rating p.bt_rating a:hover {
    opacity: 0.5;
    color: #333;
}

#d-ie7 #page #content div.area-lessonnote div.area-rating p.bt_rating {
    width: 140px;
    text-align: center;
}

#page #content div.area-lessonnote div.area-rating p.rating_txt {
    width: 120px;
    margin: 0 auto;
}

#d-ie7 #page #content div.area-lessonnote div.area-rating p.rating_txt {
    clear: both;
    width: 120px;
    margin: 0 0 0 10px;
}

#page #content div.area-lessonnote .contents_main {
    margin: 0 3px 0 153px;
}

#page #content div.area-lessonnote > a.banner_side {
    display: block;
}

#page #content div.area-lessonnote .area-message,
#page #content div.area-lessonnote .area-sentence,
#page #content .area-word,
#page #content .area-memo,
#page.area-single #content .area-selecttype .area-find {
    margin: 0 0 15px 0;
    background: #fff;
    border: 1px #E0E0E0 solid;
    border-radius: 8px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#page #content div.area-lessonnote .contents_main .area-sentence p,
#page #content div.area-lessonnote .contents_main .area-word p {
    padding: 12px 20px;
}

#page #content div.area-lessonnote .contents_main .capt {
    display: block;
    padding: 0 16px;
    height: 56px;
    line-height: 56px;
}
#page #content div.area-lessonnote .contents_main .capt strong{
    display: inline-block;
    font-size: 22px!important;
    font-weight: bold;
    line-height: 1;
    vertical-align: middle;
}
#page #content div.area-lessonnote .contents_main .capt img{
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
    position: relative;
}
#page #content div.area-lessonnote .area-message .capt{
    border-bottom: solid 1px #E5E5E5;
}
#page #content div.area-lessonnote .area-message .capt img{
    height: 35px;
}
#page #content div.area-lessonnote .area-sentence .capt img{
    height: 24px;
    margin-right: 25px;
}
#page #content div.area-lessonnote .area-word .capt img{
    height: 32px;
}
#page #content div.area-lessonnote .area-memo .capt img{
    height: 42px;
}
/* ↓↓ member/lesson_note/index.html & after_ealute.html Add Font Awesome CSS 2017/02/28. ↓↓ */
.area-memo .capt a {
  vertical-align: middle;
  margin: 0 0 0 14px;
}

.area-memo .capt a span.fa {
  font-size: 16px !important;
  color: #68cdf4;
}
/* ↑↑ member/lesson_note/index.html & after_ealute.html Add Font Awesome CSS 2017/02/28 End. ↑↑ */
#page #content div.area-lessonnote .contents_main .sect .box-emp-message{
    display: block;
    padding: 20px;
    line-height: 2;
    background: #F7F7F7;
    letter-spacing: 2px;
    word-break: break-all;
}

#page #content div.area-lessonnote .contents_main .sect .tb {
    clear: right;
    font-size: 14px;
}

#page #content div.area-lessonnote .contents_main .sect input[type="text"]{
    display: inline-block;
    border: solid 1px #989898;
    color: #989898;
    border-radius: 4px;
    height: 32px;
    line-height: 32px;
    padding: 6px 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #FFFFFF;
    vertical-align: middle;
}
#page #content div.area-lessonnote .contents_main .area-sentence .sect input[type="text"]{
    width: 436px;
}

#page #content div.area-lessonnote .contents_main .sect .add-row{
    display: block;
    text-align: center;
    height: 48px;
    line-height: 48px;
}
#page #content div.area-lessonnote .contents_main .sect .add-row a{
    display: block;
    font-size: 14px;
    color: #555555;
    border-radius: 0 0 8px 8px;
}
#page #content div.area-lessonnote .contents_main .sect .add-row a:hover{
    opacity: 1;
    background: #FAFAFA;
}
#page #content div.area-lessonnote .contents_main .sect .add-row a .ico-add{
    display: inline-block;
    vertical-align: middle;
    background: #555555;
    margin-right: 18px;
    height: 23px;
    line-height: 23px;
    width: 23px;
    border-radius: 23px;
    color: #FFFFFF;
    font-size: 14px;
    text-align: center;
}

#page #content div.area-lessonnote .contents_main .sect .add-row a .ico-add span{
    display: inline-block;
    line-height: 1;
}


#page #content div.area-lessonnote .contents_main .area-sentence .sect,
#page #content div.area-lessonnote .contents_main .area-word .sect {
    font-weight: normal;
    font-size: 14px;
}
#page #content div.area-lessonnote .contents_main .area-message .sect,
#page #content div.area-lessonnote .contents_main .area-memo .sect {
    padding: 15px 20px 20px;
    line-height: 1.8;
    font-size: 14px;
}

#page #content div.area-lessonnote .contents_main .area-sentence .sect table.tb {
    width: 100%;
    border-collapse: collapse;
}

/***************area-word******************/
#page #content div.area-lessonnote .contents_main .area-word .sect .header{
    height: 24px;
    line-height: 24px;
    vertical-align: middle;
    color: #5C5C5C;
    background: #E1E1E1;
    padding: 0;
    font-weight: normal;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header li{
    display: inline-block;
    float: left;
    padding: 0 4px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header li.l_01{
    width: 10%;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header li.l_02{
    width: 21%;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header li.l_03{
    width: 14%;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header li.l_04{
    width: 59%;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header li.l_05{
    width: 9%;
    text-align: center;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td{
    padding: 0 4px;
    color: #989898;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header .bulk-delete{
    display: block;
    text-align: center;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header .bulk-delete a
{
    display: inline-block;
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/ico_bulk_delete.png') -20px 0 no-repeat;
    width: 20px;
    height: 18px;
    vertical-align: middle;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header .bulk-delete a.disabled
{
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/ico_bulk_delete.png') 0 0 no-repeat;
    pointer-events: none;
    cursor: default;
}
#page #content div.area-lessonnote .contents_main .area-word .sect .header .bulk-delete a.disabled:hover{
    opacity: 1;
}

#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-count{
    text-align: center;
    width: 9%;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-word{
    text-align: left;
    width: 18%;
    color: #333333;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-pos{
    text-align: left;
    right: 0;
    width: 14%;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-meaning{
    width: 50%;
    position: relative;
}
#page #content div.area-lessonnote .contents_main .area-word table.tb td.row-checkbox{
    text-align: center;
    width: 9%;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-meaning input[type="text"]{
    width: 100%;
    margin: 0;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-word input[type="text"]{
    width: 95%;
    margin: 0;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-pos .select-pos select{
    height: 32px;
    width: 95%;
    border: solid 1px #989898;
    color: #989898;
    padding: 4px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #FFFFFF url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/ico_arrow_down.png") no-repeat 90% center;
    border-radius: 4px;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table.tb td.row-meaning > div{
    display: inline-block;
    vertical-align: middle;
    line-height: 32px;
    width: 85%;
}
#page #content div.area-lessonnote .contents_main .area-sentence .sect table.tb td .btn{
    float: none;
}
#page #content div.area-lessonnote .contents_main .sect table.tb td .btn{
    float: right;
    vertical-align: middle;
    background: transparent;
    padding: 0;
    margin: 0;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .contents_main .sect table.tb td .btn a{
    display: inline-block;
    right: 0;
    vertical-align: middle;
    border-radius: 4px;
    width: 32px;
    height: 32px;
    line-height: 32px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .contents_main .sect table.tb td .btn a > img{
    display: inline-block;
    width: 18px;
    vertical-align: middle;
    position: relative;
    top: -1px;
}
#page #content div.area-lessonnote .contents_main .sect table.tb td .btn .btn-edit{
    display: block;
    border: solid 1px #CACACA;
    background: #FFFFFF;
}
#page #content div.area-lessonnote .contents_main .sect table.tb td .btn .btn-save{
    display: block;
    background: #5fbfe9;
    border: solid 1px #5fb4e9;
    color: #FFFFFF;
}

/***************checkbox******************/
#page #content div.area-lessonnote .contents_main .area-word table.tb td.row-checkbox input[type="checkbox"] {
    display: none;
}
#page #content div.area-lessonnote .contents_main .area-word table.tb td.row-checkbox input[type="checkbox"] + label:before {
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/checkbox_word.png') 0 0 no-repeat;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: bottom;
    position: relative;
    bottom: 2px;
}
#page #content div.area-lessonnote .contents_main .area-word table.tb td.row-checkbox input[type="checkbox"]:checked + label:before {
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/checkbox_word.png') -16px 0 no-repeat;
}

#page #content div.area-lessonnote .contents_main .area-word .sect table tr,
#page #content div.area-lessonnote .contents_main .area-sentence .sect table tr{
    height: 48px;
    vertical-align: middle;
}
#page #content div.area-lessonnote .contents_main .area-sentence .sect table  tr:nth-child(odd),
#page #content div.area-lessonnote .contents_main .area-word .sect table  tr:nth-child(odd){
    background: #F1F1F1 !important;
}
#page #content div.area-lessonnote .contents_main .area-sentence .sect table  tr:nth-child(even),
#page #content div.area-lessonnote .contents_main .area-word .sect table  tr:nth-child(even){
    background: #F7F7F7 !important;
}
#page #content div.area-lessonnote .contents_main .area-word .sect table tr td,
#page #content div.area-lessonnote .contents_main .area-sentence .sect table tr td{
    vertical-align: middle;
}

/***************area-sentence******************/
#page #content div.area-lessonnote .contents_main .area-sentence .sect table.tb .l-td {
    width: 48px;
    padding: 0;
    color: #8a8989;
    text-align: center;
}

#page #content div.area-lessonnote .contents_main .area-sentence .sect table.tb .r-td {
    padding: 7px;
}

#page #content div.area-lessonnote .contents_main .area-sentence .sect table.tb .odd {
    background: #f7f7f7;
}

#page #content div.area-lessonnote .contents_main .area-sentence .sect table.tb .even {
    background: #fff;
}

/***************area-memo******************/
#page #content div.area-lessonnote .area-memo .capt{
    display: block;
    height: 68px;
    line-height: 68px;
}
#page #content div.area-lessonnote .contents_main .area-memo .sect{
    padding-top: 0;
}
#page #content div.area-lessonnote .contents_main .area-memo .sect textarea {
    width: 100%;
    margin: 0 0 10px;
    border: 1px solid #989898;
    border-radius: 6px;
    overflow: hidden;
}
#page #content div.area-lessonnote .area-memo .btn{
    display: block;
    background: transparent;
    padding: 0;
    margin: 0;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .area-memo .btn a{
    display: inline-block;
    border-radius: 4px;
    width: 98px;
    height: 32px;
    line-height: 32px;
    font-weight: normal;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content div.area-lessonnote .area-memo .btn a > img{
    display: inline-block;
    width: 18px;
    vertical-align: middle;
    position: relative;
    right: 8px;
    top: -1px;
}
#page #content div.area-lessonnote .area-memo .btn .btn-register{
    background: #5fbfe9;
    border: solid 1px #5fb4e9;
    color: #FFFFFF;
}



#d-ie7 #page #content div.area-lessonnote .contents_main .area-memo .sect textarea {
    width: 99%;
}

#page #content div.area-lessonnote .contents_main .bt_wordlist {
    float: right;
    text-align: center;
    vertical-align: middle;
}

#page #content div.area-lessonnote .contents_main .bt_wordlist a {
    display: inline-block;
    height: 32px;
    line-height: 32px;
    width: 126px;
    background: #F0F0F0;
    border: 1px solid #E2E2E2;
    color: #5C5C5C;
    border-radius: 3px;
    padding: 0;
    font-weight: normal;
    font-size: 12px;
    text-decoration: none;
    position: relative;
    opacity: 1.0;
    vertical-align: middle;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#page #content div.area-lessonnote .contents_main .bt_wordlist a span{
    display: inline-block;
    font-size: 12px;
    line-height: 1;
}

#page #content div.area-lessonnote .contents_main .bt_wordlist a:hover {
    opacity: 0.7;
    color: #333;
}

#page #content div.area-lessonnote .contents_main .bt_date_bottom_back {
    float: left;
}

#page #content div.area-lessonnote .contents_main .bt_date_bottom_next {
    margin-left: 310px;
}

#page #content div.area-lessonnote .contents_main a.bt_txt {
    position: absolute;
    width: 260px;
    height: 31px;
    border: 1px solid #c1c1c1;
    border-radius: 3px;
    /*background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#ececec));
    background-image: -moz-linear-gradient(top, #f4f5f5, #ececec);
    background-image: linear-gradient(to bottom, #f4f5f5, #ececec);
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#f4f5f5, endColorstr=#ebebeb);*/

    color: #000;
    font-weight: 300;
    text-decoration: none;
    text-align: center;
    line-height: 280%;
    opacity: 1.0;
}

#page #content div.area-lessonnote .contents_main a:hover.bt_txt {
    /*background-image: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb));
    background-image: -moz-linear-gradient(top, #ededed, #e0e0e0);
    background-image: linear-gradient(to bottom, #ededed, #e0e0e0);
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ededed, endColorstr=#e0e0e0);*/

    opacity: 0.7;
}
/*from lesson_note index.html*/
#page #content div.area-lessonnote .contents_side dt.detail{
    border-bottom: solid 2px #56BEEE;
    color: #56BEEE;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 0 5px;
}
#content > div > div.contents_side > dl > dt.dt_head{
    font-weight: bold;
    padding: 2px;
    margin-left: 2px;
    margin-bottom: 5px;
    font-size: 14px;
}
#content > div > div.contents_main > div.area-memo > div.sect > div > a{
    background: #eee;
    border: 1px solid #ddd;
    font-size: 1.2em;
    font-weight: 300;
    padding: 3px 12px;
    border-radius:3px;
    text-decoration: none;
    opacity: 1.0;
}
#content > div > div.contents_main > div.area-memo > div.sect > div > a:hover{
    opacity: 0.7;
    color: #333;
}

.fn-addbtn{
    background: #868585;
    padding: 2px 8px;
    border-radius:10px;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 300;
}

/* ========================= area-wordlist */

#page #content div.area-wordlist .pagetop {
    margin: -14px 6px 26px 0;
    font-size: 10px;
    text-align: right;
}

#page #content div.area-wordlist ul.alphabet_list {
    width: 730px;
    height: 32px;
    margin-bottom: 10px;
    text-align: center;
}

#page #content div.area-wordlist ul.alphabet_list li a {
    float: left;
    font-size: 16px;
    width: 25px;
    height: 25px;
    line-height: 26px;
    padding: 0;
    background-color: #FFFFFF;
    border-radius: 25px;
    margin-right: 3px;
    color: #3c3c3c;
    text-decoration: none;
}

#page #content div.area-wordlist ul.alphabet_list li:first-child > a,
#page #content div.area-wordlist ul.alphabet_list li:nth-child(2) > a,
#page #content div.area-wordlist ul.alphabet_list li:nth-child(3) > a,
#page #content div.area-wordlist ul.alphabet_list li:nth-child(4) > a,
#page #content div.area-wordlist ul.alphabet_list li:nth-child(5) > a {
    margin-right: 4px;
}

#page #content div.area-wordlist ul.alphabet_list li:last-child > a {
    margin-right: 0!important;
}

#page #content div.area-wordlist ul.alphabet_list li a:hover {
    text-decoration: none;
    color: #FFFFFF;
    background-color: #63c1e8;
}

#page #content div.area-wordlist ul.alphabet_list li a.on {
    background-color: #5fc0ea;
    color: #FFFFFF;
    cursor: default;
}

#page #content .area-wordlist .area-word {
    border: 0;
    box-shadow: none;
    font-weight: normal;
    background-color: #FFFFFF;
    padding: 20px 20px 40px 20px;
    border-radius: 20px;
}
/* word-details-header and word-header*/

#page #content .area-wordlist .area-word .word-header {
    display: block;
    padding: 10px 0;
    vertical-align: middle;
}

#page #content .area-wordlist .area-word .word-header h2 {
    display: inline-block;
    color: #3c3c3c;
    line-height: 26px;
    font-size: 26px;
    font-weight: normal;
    margin: 0 20px 0 0;
    padding: 0;
    background: transparent;
    border: 0;
}

#page #content .area-wordlist .area-word .word-header span {
    display: inline-block;
    position: relative;
    top: -5px;
    color: #999999;
    font-size: 12px;
    line-height: 26px;
}

#page #content .area-wordlist .area-word .word-header small {
    display: block;
    font-size: 12px;
    line-height: 26px;
}

#page #content .area-wordlist .area-word .word-details-header {
    display: block;
    padding: 10px 0;
}

#page #content .area-wordlist .area-word .word-details-header h2 {
    display: inline-block;
    height: 50px;
    width: 50px;
    line-height: 50px;
    font-size: 26px;
    text-align: center;
    border-radius: 60px;
    background: #5fc0ea;
    color: #FFFFFF;
    margin: 0 20px 0 0;
    padding: 0;
    border: 0;
}

#page #content .area-wordlist .area-word .word-details-header span {
    display: inline-block;
    color: #999999;
    font-size: 12px;
}
/* ========================= table.tb ==============*/

#page #content .sect input[type="add"] {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/add.png) left top no-repeat;
}

#page #content .area-wordlist .area-word table.tb {
    width: 100%;
    border-collapse: collapse;
    color: #3c3c3c;
}

#page #content .area-wordlist .area-word .tb th,
#page #content .area-wordlist .area-word .tb td {
    vertical-align: middle;
}
/* =========== table.tb header */

#page #content .area-wordlist .area-word table.tb th {
    border-bottom: 2px solid #c2c2c2;
    border-top: 2px solid #FFFFFF;
}

#page #content .area-wordlist .area-word table.tb th div {
    line-height: 20px;
    padding: 4px 5px;
}

#page #content .area-wordlist .arrow-down {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #c2c2c2;
    display: inline-block;
    margin-right: 0!important;
    vertical-align: middle;
}

#page #content .area-wordlist .arrow-up {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 6px solid #5fc0ea;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}
#page #content .area-wordlist table.tb th a
{
    display: block;
}
#page #content .area-wordlist table.tb th .arrow-down
{
    border-top-color: #bbb;
}
#page #content .area-wordlist table.tb th div:hover .arrow-down
{
    border-top-color: #bbb;
}
#page #content .area-wordlist table.tb .arrow-down,
#page #content .area-wordlist table.tb .arrow-up {
    position: relative;
    top: -1px;
    left: 3px;
}
#page #content .area-wordlist .area-word table.tb th
{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page #content .area-wordlist .area-word table.tb th div:hover
{
    background-color: #f3f3f3;
}
#page #content .area-wordlist .area-word table.tb th.col_07 div,
#page #content .area-wordlist .area-word table.tb th.col_07 div:hover
{
    background: transparent!important;
    cursor: default;
}
#page #content .area-wordlist .area-word table.tb tr:first-child
{
    background: #FFFFFF!important;
}
#page #content .area-wordlist .area-word table.tb th.col_01
{
    width: 5%;
    text-align: center;
}
#page #content .area-wordlist .area-word table.tb th.col_02,
#page #content .area-wordlist .area-word table.tb th.col_06
{
    width: 15%;
}
#page #content .area-wordlist .area-word table.tb th.col_03,
#page #content .area-wordlist .area-word table.tb th.col_05
{
    width: 10%;
    text-align: left;
}

#page #content .area-wordlist .area-word table.tb th.col_04
{
    width: 26%;
    padding: 5px;
}
#page #content .area-wordlist .area-word table.tb th.col_07
{
    width: 9%;
    text-align: right!important;
}

/* =========== check all checkbox / delete all */
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all .bulk-delete
{
    clear: both;
    position: relative;
    bottom: 3px;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all .bulk-delete button
{
    display: inline-block;
    background: transparent;
    float: left;
    position: relative;
    border: 0;
    padding: 4px;
    text-align: center;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all .bulk-delete button:hover
{
    background: #f3f3f3;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all .bulk-delete button:disabled:hover
{
    background: transparent;
    cursor: default;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all .bulk-delete button span
{
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/ico_bulk_delete.png') -20px 0 no-repeat;
    width: 20px;
    height: 20px;
    display: block;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all .bulk-delete button:disabled span
{
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/ico_bulk_delete.png') 0 0 no-repeat;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all > span
{
    display: inline-block;
    padding-right: 7px;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all input[type=checkbox] {
    display: none;
}

#page #content .area-wordlist .area-word table.tb th.col_07.cb_all input[type=checkbox] + label:before {
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/checkbox_word.png') 0 0 no-repeat;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    position: relative;
    bottom: 0;
    cursor: pointer;
}
#page #content .area-wordlist .area-word table.tb th.col_07.cb_all input[type=checkbox]:checked + label:before {
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/checkbox_word.png') -16px 0 no-repeat;
}
/* =========== table.tb data */

#page #content .area-wordlist .area-word table.tb td {
    padding: 6px 4px;
    vertical-align: middle;
    color: #999999;
    font-size: 12px;
    height: auto;
    border: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#page #content .area-wordlist .area-word table.tb td.row_count,
#page #content .area-wordlist .area-word table.tb td.row_edit {
    text-align: center;
}
#page #content .area-wordlist .area-word table.tb td.row_count
{
    font-size: 14px;
}
#page #content .area-wordlist .area-word table.tb td.row_checkbox
{
    text-align: right;
    padding-right: 8px;
}
#page #content .area-wordlist .area-word table.tb td.row_word {
    color: #333333;
}

#page #content .area-wordlist .area-word table.tb td.row_pos {
    text-align: left;
}

#page #content .area-wordlist .area-word table.tb td.row_edit {}

#page #content .area-wordlist .area-word .row_lessonnote small {
    font-size: 9px!important;
}
/* =========== check box for individual word */

#page #content .area-wordlist .area-word table.tb td.row_checkbox input[type=checkbox] {
    display: none;
}

#page #content .area-wordlist .area-word table.tb td.row_checkbox input[type=checkbox] + label:before {
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/checkbox_word.png') 0 0 no-repeat;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: bottom;
    position: relative;
    bottom: 2px;
}

#page #content .area-wordlist .area-word table.tb td.row_checkbox input[type=checkbox]:checked + label:before {
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/checkbox_word.png') -16px 0 no-repeat;
}
/* =========== inputs in table data */

#page #content .area-wordlist input[type="checkbox"] + label,
#page #content .area-wordlist button{
    cursor: pointer;
}
#page #content .area-wordlist .next_25:hover,
#page #content .area-wordlist .area-word .meaning-edit:hover a
{
    opacity: .7;
}

#page #content .area-wordlist .area-word .meaning-edit {
    display: block;
    position: relative;
}

#page #content .area-wordlist .area-word .meaning-edit a {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/bt_edit_save.png') 0 0 no-repeat;
    display: block;
    color: #999999;
    border: 0;
    border-radius: 3px;
    height: 34px;
    width: 68px;
    padding: 0;
    line-height: 34px;
    text-decoration: none;
}

#page #content .area-wordlist .area-word .meaning-edit a:before {
    position: relative;
    content: "編集";
    left: 10px;
}

#page #content .area-wordlist .area-word .meaning-edit.save a {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/bt_edit_save.png') 0 -34px no-repeat;
    color: #FFFFFF;
}

#page #content .area-wordlist .area-word .meaning-edit.save a:before {
    position: relative;
    content: "登録";
    left: 10px;
}
#page #content .area-wordlist .area-word input[type="text"]
{
    border: solid 1px #acacac;
    background-color: #FFFFFF;
    height: 24px;
    width: 92%;
    border-radius: 4px;
    padding: 4px;
    color: #999999;
    vertical-align: middle;
    line-height: 24px;
    margin: 0;
}

#page #content .area-wordlist .area-word table.tb td.row_meaning .input_meaning:focus {
    border: 1px solid #5fc0ea;
}

#page #content .area-wordlist .next_25 {
    background-color: #5fc0ea;
    display: inline-block;
    text-decoration: none;
    line-height: 40px;
    color: #FFFFFF;
    height: 40px;
    width: 400px;
    border: 0;
    border-radius: 50px;
    text-align: center;
}

#page #content .area-wordlist .next_25 i {
    position: relative;
    display: inline;
    vertical-align: middle;
    right: -135px;
    top: 1px;
}

.caret-right {
    position: relative;
    cursor: pointer;
}

.caret-right:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-left: 8px solid #333;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
}

.caret-right:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 0;
    border-left: 6px solid #FFF;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}

.caret-left {
    position: relative;
    cursor: pointer;
}

.caret-left:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-right: 8px solid #333;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
}

.caret-left:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    border-right: 6px solid #FFF;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}

#page #content .area-wordlist .next_25 .caret-right:after {
    border-left: 5px solid #5fc0ea;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

#page #content .area-wordlist .next_25 .caret-right:before {
    border-left: 7px solid #FFFFFF;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
}
/* ============== add-word */
#page #content .area-wordlist .add-word
{
    display: block;
    margin-bottom: 30px;
}
#page #content .area-wordlist .add-word button
{
    display: block;
    border: solid 1px #E1E1E1;
    height: 46px;
    width: 100%;
    line-height: 46px;
    background: #FFFFFF;
    padding: 0;
}
#page #content .area-wordlist .add-word button:hover
{
    background: #F9F9F9;
}
#page #content .area-wordlist .add-word button img
{
    width: 25px;
    vertical-align: middle;
    margin-right: 10px;
}
#page #content .area-wordlist .area-word .select-pos
{
    width: 75px;
    overflow: hidden;
}
#page #content .area-wordlist .area-word .select-pos select
{
    width: 75px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 2px 2px 2px 2px;
    border: none;
    background: transparent url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/ico_arrow_down.png") no-repeat 60px center;
    color: #999999;
}
#page #content .area-wordlist .area-word .select-pos select option
{
    width: 75px;
    padding: 0;
}
/* ============== pagination */
#page #content .area-wordlist .pagination_25
{
    margin-top: 35px;
    display: block;
}
#page #content .area-wordlist .pagination_25 li
{
    position: relative;
    display: inline-block;
    margin: 0 2px;
}
#page #content .area-wordlist .pagination_25 li a
{
    text-decoration: none;
    display: block;
    background-color: #FFFFFF;
    border: solid 1px #dbdbdb;
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    color: #888888;
    font-size: 12px;
    border-radius: 32px;
}
#page #content .area-wordlist .pagination_25 li.active
{
    text-decoration: none;
    background-color: #FFFFFF;
    border: solid 1px #dbdbdb;
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    color: #888888;
    font-size: 12px;
    border-radius: 32px;
}
#page #content .area-wordlist .pagination_25 li.active
{

}
#page #content .area-wordlist .pagination_25 li a i
{
    position: absolute;
    top: 11px;
}
#page #content .area-wordlist .pagination_25 li a i.caret-right
{
    left: 14px;
}
#page #content .area-wordlist .pagination_25 li a i.caret-left
{
    left: 14px;
}
#page #content .area-wordlist .pagination_25 li a .caret-right:before
{
  border-left: 6px solid #888888;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
}
#page #content .area-wordlist .pagination_25 li a .caret-right:after
{
    border-left: 4px solid #FFFFFF;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
}
#page #content .area-wordlist .pagination_25 li a .caret-left:before
{
  border-right: 6px solid #888888;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
}
#page #content .area-wordlist .pagination_25 li a .caret-left:after
{
  border-right: 4px solid #FFF;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}
/* pagination hover */
#page #content .area-wordlist .pagination_25 li a:hover
{
    background-color: #dbdbdb;
    border-color: #dbdbdb;
    color: #888888;
}
#page #content .area-wordlist .pagination_25 li a:hover .caret-right:before
{
    border-left-color: #888888;
}
#page #content .area-wordlist .pagination_25 li a:hover .caret-left:before
{
    border-right-color: #888888;
}
#page #content .area-wordlist .pagination_25 li a:hover .caret-left:after
{
    border-right-color: #dbdbdb;
}
#page #content .area-wordlist .pagination_25 li a:hover .caret-right:after
{
    border-left-color: #dbdbdb;
}
/* pagination active */
#page #content .area-wordlist .pagination_25 li a.active,
#page #content .area-wordlist .pagination_25 li.active
{
    color: #FFFFFF;
    background-color: #5fc0ea;
    border-color: #5fc0ea;
    cursor: default;
}
#page #content .area-wordlist .pagination_25 li a.active i
{
    cursor: default;
}
#page #content .area-wordlist .pagination_25 li a.active .caret-right:before
{
    border-left-color: #FFFFFF;
}
#page #content .area-wordlist .pagination_25 li a.active .caret-left:before
{
    border-right-color: #FFFFFF;
}
#page #content .area-wordlist .pagination_25 li a.active .caret-right:after
{
    border-left-color: #5fc0ea;
}
#page #content .area-wordlist .pagination_25 li a.active .caret-left:after
{
    border-right-color: #5fc0ea;
}

/* pagination active */
#page #content .area-wordlist .pagination_25 li a.inactive
{
    color: #FFFFFF;
    background-color: #e1e1e1;
    border-color: #e1e1e1;
    cursor: default;
}
#page #content .area-wordlist .pagination_25 li a.inactive i
{
    cursor: default;
}
#page #content .area-wordlist .pagination_25 li a.inactive .caret-right:before
{
    border-left-color: #FFFFFF;
}
#page #content .area-wordlist .pagination_25 li a.inactive .caret-right:after
{
    border-left-color: #e1e1e1;
}
#page #content .area-wordlist .pagination_25 li a.inactive .caret-left:before
{
    border-right-color: #FFFFFF;
}
#page #content .area-wordlist .pagination_25 li a.inactive .caret-left:after
{
    border-right-color: #e1e1e1;
}

/* important css for tb-table*/

#page #content table.tb td.l_01 {
    height: 15px;
    padding: 10px 0px;
    color: #8B8A8A ;
    text-align: center;
}
#page #content table.tb th.l_01 {
    width: 10%;
    padding: 2px;
    border-top: 1px solid #BEBDBD ;
    border-bottom: 1px solid #BEBDBD ;
    background: #D7D5D5  none repeat scroll 0% 0%;
}
#page #content table.tb th.l_02 {
    width: 25%;
    padding: 2px 0px;
    border-top: 1px solid #BEBDBD ;
    border-bottom: 1px solid #BEBDBD ;
    background: #D7D5D5  none repeat scroll 0% 0%;
}
#page #content table.tb th.l_03 {
    width: 50%;
    padding: 2px 7px;
    border-top: 1px solid #BEBDBD ;
    border-bottom: 1px solid #BEBDBD ;
    background: #D7D5D5  none repeat scroll 0% 0%;
}
#page #content table.tb th.l_04 {
    width: 15%;
    padding: 2px;
    border-top: 1px solid #BEBDBD ;
    border-bottom: 1px solid #BEBDBD ;
    background: #D7D5D5  none repeat scroll 0% 0%;
}
#page #content table.tb td.l_02 {
    height: 15px;
    padding: 10px 0px;
}
#page #content table.tb {
    width: 100%;
    border-collapse: collapse;
}
#page #content table.tb td.l_03 {
    height: 15px;
    padding: 3px 0px;
    text-align: right;
    vertical-align: middle;
    position: relative;
    right: 10px;
}
#page #content table.tb td.l_03 a {
    background: #EEE none repeat scroll 0% 0%;
    border: 1px solid #DDD;
    padding: 3px 6px;
    font-weight: 300;
    border-radius: 3px;
    text-decoration: none;
    opacity: 1;
}
#page #content table.tb .input_j {
    width: 300px;
    height: 17px;
    border: 1px solid #37B8F5 ;
    margin: 0px 0px 0px 2px;
    padding: 0px 0px 0px 5px;
    border-radius: 3px;
    color: #696969 ;
    font-size: 12px;
}
#page #content table.tb .input_e {
    width: 130px;
    height: 17px;
    border: 1px solid #37B8F5 ;
    border-radius: 3px;
    margin: 0px 0px 0px -2px;
    padding: 0px 0px 0px 5px;
    color: #696969 ;
    font-size: 12px;
}
#page #content div.area-lessonnote .contents_main .area-sentence .sect table tr:nth-child(odd) {
    background: #ECECE9  none repeat scroll 0% 0%;
}
/*
#page #content table tr:nth-child(odd) {
background: #F9F9F8  none repeat scroll 0% 0%;
}
*/
#page #content div.area-lessonnote .contents_main .capt span {
    font-size: 1.8em;
    position: relative;

}


/* ========================= div.area-welcome */
#page #content div.area-welcome {
    margin: 6px 0 40px;
    padding: 20px;
    background: #fff;
    border: 2px #e1e1e1 solid;
    border-radius: 6px;
    text-align: center;
}
#page #content div.area-welcome .ttl {
    margin: 0 0 12px;
}
/* ========================= div.area-search */
#page #content div.area-search {
    background: #f8f5f1;
    border-radius: 0;
    font-size: 12px;
    margin-bottom: 17px;
    padding: 0;
}
#page #content div.area-search > div {
  padding: 0;
}
#page #content div.schedules-list + div.area-search {
    margin: 50px 20px 20px;
}
#page #content div.area-search ul, .time-search , .search-condition,
 .search-special, .search-keyword{
    overflow: hidden;
    padding: 10px;
    border-top: 1px solid #fff;
    /*margin-left:6px;*/
}

#page #content div.area-search ul
{
  margin: 0;
}
#page #content div.area-search > ul li {
    border: 0;
    float: left;
    text-align: center;
}
#page #content div.area-search ul.search-date li {
    background: #fff;
    width: 100px;
    border: 1px solid #bbb6b4;
    margin-right: -1px;
    float: left;
    text-align: center;
    /*remove*/
    /*background: #e4e4e4 url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_date.png) repeat-x left top;*/
}
#page #content div.area-search ul.search-date li span {
    font-size: 20px;
}
#page #content div.area-search ul.search-date li:first-child {
    /*remove*/
    /*background: #f6f6f6 url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_today.png) repeat-x left top;*/
}
#page #content div.area-search ul.search-date li:first-child a:hover {
    /*remove*/
    /*background: #f6e95c url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_today_on.png) repeat-x left top;*/
}
#page #content div.area-search ul.search-time li {
    width: 111px;
    border-right: 1px #d1d1d1 solid;
    border-bottom: 1px #d1d1d1 solid;
    border-left: 1px #f7f7f7 solid;
    background: #e5e5e5;
}
#page #content div.area-search ul.search-time li:first-child {
    width: 113px;
}
#page #content div.area-search .search-detail {
    border: #d1d1d1 solid;
    border-width: 0 1px 1px 1px;
    background: #c3efff url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_detail.png) repeat-x left top;
    text-align: center;
}
#page #content div.area-search ul.search-date li:first-child, #page #content div.area-search ul.search-time li:first-child {
    border-left: 1px #d1d1d1 solid;
}
#page #content div.area-search ul li a, #page #content div.area-search .search-detail a {
    display: block;
    padding: 6px;
    color: #5b5858;
    text-decoration: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#page #content div.area-search ul li a:hover, #page #content div.area-search .search-detail a:hover {
    color: #ff7f00;
}
#page #content div.area-search ul.search-date li a:hover {
    /*remove*/
    /*background: #e4d855 url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_date_on.png) repeat-x left top;*/
    background: #F18931;
    color: #fff;
    border-left: 1px solid #e37a21;
}
#page #content div.area-search ul.search-time li a:hover {
    /*background: #e5d955 url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_time_on.png) repeat-x left top;*/
    opacity: 0.5;
    color: #333;
}
#page #content div.area-search .search-detail a:hover {
    /*background: #baedff url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_detail_on.png) repeat-x left bottom;*/
}
#page #content div.area-search ul li.on {
    /*background: #e4d855 url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_date_on.png) repeat-x left top;*/
}
#page #content div.area-search ul.search-date li.on:first-child {
    /*remove*/
    /*background: #f6e95c url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/bg_today_on.png) repeat-x left top;*/
}
#page #content div.area-search ul li.on a {
    color: #fff !important;
    background: #f18931;
}
#page #content div.area-search table.form th {
    width: 15%;
}
#page #content div.area-search .more {
    padding: 20px;
    background: #fff;
    /*remove*/
    /*box-shadow: inset 0 0px 6px rgba(0,0,0,0.3);*/
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect
{
    margin-top: 20px;
    position: relative;
    display: block;
    padding: 0 85px;
    overflow: hidden;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect + a {
    display: block;
    padding-top: 20px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect + a:hover {
    opacity: 0.8;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > img.award-logo
{
    vertical-align: middle;
    margin-right: 10px;
    height: 100px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > div.award-text
{
    position: relative;
    top: 10px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > div.award-text > div:first-child
{
    height: 52px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > div.award-text > div:first-child > span
{
    float: left;
    margin-right: 10px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > div.award-text > div:first-child > span > p
{
    line-height: 28px;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 17px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > div.award-text > div:last-child
{
    display: inline-block;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > div.award-text > div:last-child small
{
    font-weight: bold;
    letter-spacing: 3px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > div.award-text > div:last-child > img
{
    vertical-align: middle;
    margin-right: 5px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner .bnr-award-sect > img
{
    float: left;
    vertical-align: middle;
}
/* ========================= area-comparison guest top */
#page #content .area-comparison .area-comparison-inner{
    width: 100%;
}

#page #content .area-comparison table.table-comparison{
    background: #ffffff;
    border-spacing: 0;
    font-size: 14px;
    margin: auto;
    width: 100%;
}
#page #content .area-comparison table.table-comparison thead{
    background: #f2f2f2;
}
#page #content .area-comparison table.table-comparison thead tr th,
#page #content .area-comparison table.table-comparison tbody tr td{
    text-align: center;
    vertical-align: middle;
}
#page #content .area-comparison table.table-comparison thead tr th{
    background: #e0e0e0;
    padding: 12px 18px;
}
#page #content .area-comparison table.table-comparison tbody tr td{
    border-top: 1px solid #e0e0e0;
    height: 44px;
    padding: 0 19px;
}
#page #content .area-comparison table.table-comparison tbody tr td small{
   color: #333;
   font-size: 11px;
}
#page #content .area-comparison table.table-comparison tbody tr:first-child td:nth-child(2){
    background: #FFFFFF;
    border-top: 1px solid #ff75ad;
    padding: 0;
}
#page #content .area-comparison table.table-comparison thead tr th:nth-child(2),
#page #content .area-comparison table.table-comparison tbody tr td:nth-child(2){
    border-left: 6px solid #ff75ad;
    border-right: 6px solid #ff75ad;
    color: #ff75ad;
}
#page #content .area-comparison table.table-comparison thead tr th:nth-child(2){
    background: #ff75ad;
    border-top: 2px solid #ff75ad;
    box-shadow: 0 -5px #ff75ad;
        -moz-box-shadow: 0 -5px #ff75ad;
        -webkit-box-shadow: 0 -5px #ff75ad;
}
#page #content .area-comparison table.table-comparison tbody tr:last-child td:nth-child(2){
    border-bottom: 2px solid #ff75ad;
    box-shadow: 0 5px #ff75ad;
        -moz-box-shadow: 0 5px #ff75ad;
        -webkit-box-shadow: 0 5px #ff75ad;
}
#page #content .area-comparison table.table-comparison thead tr th:first-child,
#page #content .area-comparison table.table-comparison tbody tr td:first-child{
    text-align: left;
}
#page #content .area-comparison table.table-comparison tbody tr td:last-child{
    border-left: 1px solid #e0e0e0;
}
#page #content .area-comparison table.table-comparison thead tr th:last-child {
    border-left: 1px solid #FFFFFF;
}

/* ========================= p.tx-noresult */
#page #content p.tx-noresult {
    margin: 30px 0;
    color: #7b7b7b;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}
/* =============== dl.sort */
#page #content div.area-schedules .list-boxcaptside p {
    margin: 2px 8px 0 0;
}
#page #content div.area-schedules .list-boxcaptside .list-unit {
    padding: 0 0 0 20px;
    border-left: 1px #bbb dotted;
}
/* =============== schedules-list */
#page #content .schedules-list {
    position: relative;
    overflow: hidden;
    border-top: 2px #bbb solid;
    border-bottom: 2px #bbb solid;
    zoom: 1;
}
#page #content .schedules-list ul.profiles {
    width: 100%;
}
#page #content .schedules-list ul.profiles {
    border-bottom: 2px #bbb solid;
}
/*tmp change*/
#page #content .schedules-list ul.profiles > li {
    float: left;
    width: 150px;
    padding: 8px 0;
    background: #f3f3f3;
}
/*tmp change*/
#page #content .schedules-list ul.profiles > li:first-child {
    margin-left: 80px;
    border-left: 2px #bbb solid;
}
#page #content .schedules-list ul.profiles .name {
    display: block;
    margin: 5px auto;
}
#page #content .schedules-list ul {
    float: left;
}
/*tmp change*/
#page #content .schedules-list ul.profiles > li,
#page #content .schedules-list ul.teacher > li {
    border-right: 1px #bbb solid;
}
#page #content .schedules-list ul li {
    text-align: center;
}
#page #content .schedules-list ul.oneday li {
    border-right: 1px solid #BBB;
}
#page #content .schedules-list ul.time li, #page #content .schedules-list ul.teacher li, #page #content .schedules-list ul.oneday li {
    height: 45px;
}
#page #content .schedules-list ul.time li > span, #page #content .schedules-list ul.teacher li > span, #page #content .schedules-list ul.oneday li > span {
    position: relative;
    top: 13px;
}
#page #content .schedules-list ul.time {
    background: #efefef;
}
#page #content .schedules-list ul.time li {
    width: 80px;
    border-right: 2px #bbb solid;
    background: #e0e0e0;
}
#page #content .schedules-list ul.teacher {
    width: 144px;
}
#page #content .schedules-list ul.teacher li {
    background: #f3f3f3;
}
#page #content .schedules-list .bt-open {
    border:1px solid #ffa400;
    border-radius: 2px;
    /*text-shadow: 1px 1px 1px #fd8308;*/
    /*-webkit-box-shadow: inset 0px 1px 0px #fed071;
    -moz-box-shadow: inset 0px 1px 0px #fed071;
    box-shadow: inset 0px 1px 0px #fed071;*/
    background: #feae13;
    /*background: -moz-linear-gradient(top, #feae13 0%, #fe990f 100%);
    background: -webkit-linear-gradient(top, #feae13 0%,#fe990f 100%);
    background: linear-gradient(to bottom, #feae13 0%,#fe990f 100%);*/
    color: #ffffff;
    font-size: 12px;
    letter-spacing: 5px;
    text-decoration: none;
    margin-top: 10px;
    padding: 2px 17px;
    position: relative;
    top: 14px;
}
#page #content .schedules-list span.close {
    color: #6d6d6d;
    font-size: 11px;
}
#d-ie7 #page #content .schedules-list li {
    line-height: 2;
}
/* Tiny Scrollbar */
#page #content .scroll-schedules {
    width: 730px;
    clear: both;
}
#page #content .scroll-schedules .viewport {
    width: 696px;
    max-height: 360px;
    overflow: hidden;
    position: relative;
}
#page #content .scroll-schedules .overview {
    list-style: none;
    position: relative;
    left: 0;
    max-height: none;
    overflow: hidden;
    top: 0;
}

#page #content .scroll-schedules .scrollbar {
    position: relative;
    float: right;
    width: 34px;
}
#page #content .scroll-schedules .track {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/ico_scrollbartrack_schedule.png) no-repeat center center;
    height: 100%;
    width: 21px;
    position: relative;
}
#page #content .scroll-schedules .thumb {
    height: 90px;
    width: 21px;
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/ico_scrollbarthumb_schedule.png) no-repeat right center;
}
#page #content .scroll-schedules .thumb:hover {
    background-position: left center;
}
#page #content .scroll-schedules .thumb .end {
    display: none;
}
#page #content .scroll-schedules .disable {
    display: none;
}
#page #content .scroll-info {
    width: 310px;
    padding-top: 10px;
    clear: both;
    zoom: 1;
}
#page #content .scroll-info .viewport {
    width: 300px;
    height: 210px;
    overflow: hidden;
    position: relative;
}
#page #content .scroll-info .overview {
    list-style: none;
    position: absolute;
    left: 0;
    top: 0;
}

#page #content .scroll-info .overview a:hover, .bt-more:hover{
    text-decoration: underline;
}
#page #content .scroll-info .scrollbar {
    position: relative;
    float: right;
    width: 10px;
}
#page #content .scroll-info .track {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest/ico_scrollbartrack_info.png) no-repeat center center;
    height: 100%;
    width: 10px;
    position: relative;
}
#page #content .scroll-info .thumb {
    height: 200px;
    width: 10px;
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest/ico_scrollbarthumb_info.png) no-repeat center bottom;
}
#page #content .scroll-info .thumb .end {
    height: 5px;
    width: 10px;
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest/ico_scrollbarthumb_info.png) no-repeat center top;
}
#page #content .scroll-info .disable {
    display: none;
}
.noSelect {
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}
/* Tiny Scrollbar ここまで */

/* ==================== #page.area-single */
#page.area-single #content div.area-schedules .schedules-list {
    margin-bottom: 50px;
}
#page.area-single #content div.area-schedules .schedules-list ul.teacher {
    width: 151px;
}
#page.area-single #content div.area-schedules .schedules-list ul.profiles li .portrait {
    margin: 0 auto;
}
/* =============== portraits-list */
#page #content .portraits-list {
    position: relative;
    overflow: hidden;
    margin-bottom: 22px;
    padding-bottom: 2px;
    zoom: 1;
}
#page #content .portraits-list ul {
    position: relative;
    top: 2px;
    left: 1px;
}
#page #content .portraits-list > ul > li {
    float: left;
    margin: -2px 0 0 -1px;
    padding: 13px 19px 15px;
    border-top: 2px #bbb solid;
    border-right: 1px #bbb solid;
    border-bottom: 2px #bbb solid;
    border-left: 1px #bbb solid;
    text-align: center;
}
/* ==================== area-detail */
#page.area-single #content div.area-detail div.area-search {
    margin: 0 0 10px;
}
#page.area-single #content div.area-detail div.area-search ul.search-time li {
    width: 104px;
    border-top: 1px #d1d1d1 solid;
}
#page.area-single #content .area-detail div.area-schedules {
    margin: 0;
    padding: 0 30px 30px;
    border-radius: 10px 10px 5px 5px;
    background: #fff;
    box-shadow: inset 0 0 4px rgba(0,0,0,0.3), 0 1px 0 #fff;
}
#page.area-single #content .area-detail div.area-schedules h2{
    font-size: 20px;
    width: 700px;
    margin-left: -30px;
}
#page.area-single #content div.area-detail div.area-schedules .schedules-list {
    margin: 0;
}
#page.area-single #content div.area-detail div.area-schedules .schedules-list li {
    width: 83px;
}
#d-ie7 #page.area-single #content div.area-detail div.area-schedules .schedules-list li {
    min-height: 45px;
}
#page.area-single #content div.area-detail div.area-schedules .schedules-list li:first-child {
    height: 34px;
    padding: 10px 0;
    border-bottom: 1px #bbb solid;
    z-index: 1;
}
#page.area-single #content div.area-detail div.area-schedules .schedules-list ul.time li {
    width: 80px;
}
#page.area-single #content div.area-detail div.area-schedules .schedules-list ul.oneday li {
    background: #f3f3f3;
}
#page.area-single #content div.area-detail div.area-schedules .schedules-list .bt-open{
    padding: 3px 6px;
    letter-spacing: 0;
}
/* ========================================================= [ #page.area-single ] */
/* ========================= dl.condition */
#page.area-single #content div.area-search dl.condition table {
    width: 270px;
}
#page.area-single #content div.area-search dl.condition table:first-child {
    margin: 0 30px 0 0;
}
/* ========================= div.trial */
#page.area-single #content div.trial {
    overflow: hidden;
    margin-bottom: 30px;
    padding: 12px;
    border: 1px #c7c7c7 solid;
}
#page.area-single #content div.trial p {
    float: left;
    margin: 3px 0;
    font-size: 16px;
    font-weight: bold;
}
#page.area-single #content div.trial .bt-cmn-st {
    float: right;
    width: 165px;
    padding: 5px 0;
    border-radius: 5px;
    color: #333;
    font-size: 14px;
    text-align: center;
}
/* ========================= area-announce */
#page.area-single #content .area-announce,
#page.area-single #content .area-mediacoverage {
    background: #ffffff;
    position: relative;
    margin: -10px 0 20px;
    padding: 0 30px 30px;
}
#page.area-single #content .area-announce {
    box-shadow: none;
    border-radius: 0;
     position: relative;
     margin: -10px 0 20px;
}
#page.area-single #content .area-announce ul.swch-list {
    position: absolute;
    top: -50px;
    right: 10px;
}
#page.area-single #content .area-announce ul.swch-list li {
    display: inline-block;
    padding: 0 10px;
    border-left: 1px #999 solid;
}
#d-ie7 #page.area-single #content .area-announce ul.swch-list li {
    display: inline;
    zoom: 1;
}
#page.area-single #content .area-announce ul.swch-list li:first-child {
    border-left: none;
}
#page.area-single #content .area-announce ul.swch-list li p {
    text-decoration: underline;
    cursor: pointer;
}
#page.area-single #content .area-announce ul.swch-list li p.on {
    font-weight: bold;
    text-decoration: none;
    cursor: default;
}
#page.area-single #content .area-announce ul.list-announce,
#page.area-single #content .area-mediacoverage ul.list-announce {
    padding-top: 20px;
}
#page.area-single #content .area-announce ul.list-announce li,
#page.area-single #content .area-mediacoverage ul.list-announce li {
    padding: 12px 0;
    border-bottom: 1px #999 dotted;
    position: relative;
}
#page.area-single #content .area-announce ul.list-announce li .hl {
    position: relative;
    padding: 5px 8px 5px 148px;
    background: #fff url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/announce/ico_headline.png) no-repeat 129px 8px;
}

#page.area-single #content .area-announce ul.list-announce li .hl a {
    font-size: 14px;
    text-decoration: none;
}
#page.area-single #content .area-announce ul.list-announce li .time {
    left: 0;
    position: absolute;
    top: 18px;
    z-index: 999;
}
#page.area-single #content .area-mediacoverage ul.list-announce li a{
    text-decoration: none;
    position: relative;
}
#page.area-single #content .area-mediacoverage ul.list-announce li .hl .time{
    position: absolute;
    top: 8px;
    right: 10px;
}

#page.area-single #content .area-announce ul.list-announce li .hl + div {
    padding: 0 30px;
}
#page.area-single #content .area-announce ul.list-announce li .hl + div > p {
    margin: 15px 0;
}
/* ========================= area-announce single*/
#page.announce-single #content .area-announce .time{
    color: #454545;
    font-size: 14px;
    font-weight: bold;
    padding-top: 20px;
}
#page.announce-single #content .area-announce h2{
    background: transparent;
    border-top: 0;
    border-bottom: 1px dotted #999;
    color: #333;
    font-size: 21px;
    line-height: 27px;
    margin: 0;
    padding: 18px 0;
}
#page.announce-single #content .area-announce div{
    padding: 20px 0;
}

#page.announce-single #content .back-txt{
    color: #00b2ec;
    display: block;
    margin-top: 20px;
    text-decoration: none;
}

/* ========================= area-mediacoverage */
#page.area-single #content .area-mediacoverage ul.list-announce li .hl{
    background: url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/announce/ico_headline.png") no-repeat scroll 10px 6px #fff;
    padding: 5px 120px 5px 33px;
    position: relative;
}

/* ========================= area-contact */
#page.area-contact #content h2 {
    background: #56beee;
    border: 0;
    border-radius: 10px 10px 0 0;
    margin-left: 0;
    margin-right: 0;
    padding-left: 25px;
}
#page.area-contact #content .area-faq-summary {
    background: #fff;
    border-radius: 5px;
    padding: 0 30px 30px;
}

#page.area-contact #content .area-faq-summary ul {
    border-bottom: 1px solid #f7f7f7;
    float: left;
    padding-bottom: 20px;
    width: 333px;
}
#page.area-contact #content .area-faq-summary ul .arrow-right {
    border-color: transparent transparent transparent #5bbfec;
    border-width: 4px 0 4px 6px;
    border-style: solid;
    display: inline-block;
    margin-right: 4px;
}
#page.area-contact #content .area-faq-summary ul li {
    box-shadow: 0px 1px 0px 0px #5bbfec;
    display: table;
    margin-bottom: 10px;
}
#page.area-contact #content .area-faq-summary ul li a {
    text-decoration: none;
}
#page.area-contact #content .area-faq-summary ul li a:hover {
    color: #333;
}
#page.area-contact #content #main-src {
    box-shadow: none;
}
#page.area-contact #content #main-src .area-inquirylist {
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
}
/* ========================= area-inquirylist */
#page.area-single #content .area-inquirylist h2 + p {
    margin: -10px 0 20px;
}
#page.area-single #content .area-inquirylist table {
    width: 695px;
    margin: 25px auto 10px;
    border: 1px #c7c7c7 solid;
    border-bottom: none;
    border-collapse: collapse;
    border-spacing: 0;
    background: #fff;
}
#page.area-single #content .area-inquirylist table th,
#page.area-single #content .area-inquirylist table td {
    line-height: 44px;
    height: 44px;
    text-align: center;
    padding: 0 10px;
    border-bottom: 1px #c7c7c7 solid;
}
#page.area-single #content .area-inquirylist table td span {
    display: block;
    width: 200px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
#page.area-single #content .area-inquirylist table td span a {
    display: block;
}
#page.area-single #content .area-inquirylist table th {
    background: #efefef;
    font-weight: normal;
}
#page.area-single #content .area-inquirylist table tr:nth-of-type(3),
#page.area-single #content .area-inquirylist table tr:nth-of-type(2n+1) {
    background: #f9f9f8;
}
#page.area-single #content .area-inquirylist table tr th {
    font-size: 15px;
    border-right: 1px solid #c7c7c7;
}
#page.area-single #content .area-inquirylist table tr th:first-of-type {
    width: 15%;
}
#page.area-single #content .area-inquirylist table tr th:nth-of-type(2),
#page.area-single #content .area-inquirylist table tr th:nth-of-type(3) {
    width: 200px;
}
#page.area-single #content .area-inquirylist table tr th:last-of-type {
    border-right: none;
}
#page.area-single #content .area-inquirylist table tr td {
    border-right: 1px solid #c7c7c7;
    font-size: 13px;
    box-sizing: border-box;
}
#page.area-single #content .area-inquirylist table tr td img {
    padding-bottom: 13px;
}
#page.area-single #content .area-inquirylist table tr td:nth-of-type(2),#page.area-single #content .area-inquirylist table tr td:nth-of-type(3) {
    text-align: left;
}
#page.area-single #content .area-inquirylist table tr td:last-of-type {
    borde: none;
}
#page.area-single #content .area-inquirylist table .active {
    cursor: pointer;
    background: #f5ed91!important;
}
#page.area-single #content .area-inquirylist table .active a {
    color: #ff7f00;
    text-decoration: none;
}
/* ========================= area-inquiryexchange */
#page.area-single #content .area-inquiryexchange ul {
    margin: 0 30px;
}
#page.area-single #content .area-inquiryexchange ul li {
    position: relative;
    margin: 0 0 40px;
}
#page.area-single #content .area-inquiryexchange ul li img:first-child {
    position: absolute;
    top: 20px;
    left: 0;
}
#d-ie7 #page.area-single #content .area-inquiryexchange ul li img:first-child {
    top: 34px;
}

#page.area-single #content .area-inquiryexchange ul li div {
    min-height: 40px;
    margin: 0 0 0 75px;
    padding: 20px;
    font-size: 13px;
    line-height: 22px;
    border: 1px #c7c7c7 solid;
    border-radius: 5px;
}

#page.area-single #content .area-inquiryexchange ul li div a {
    color: #3997DC;
    text-decoration: underline;
}

#page.area-single #content .area-inquiryexchange ul li div p {
    margin: 20px -20px -20px;
    padding: 7px;
    font-size: 12px;
    border-radius: 0 0 5px 5px;
    background: #efefef;
    text-align: right;
}
#page.area-single #content .area-inquiryexchange div.bx-gray {
    padding: 30px;
    background: #efefef;
    text-align: center;
}
#page.area-single #content .area-inquiryexchange div.bx-gray textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
}
#page.area-single #content .area-inquiryexchange div.bx-gray + p a {
    text-decoration: underline;
}
/* ========================================================= [ #page.area-single .area-detail ] */
#page.area-single #content .area-detail {
    overflow: hidden;
    margin-top: 15px;
}
#page.area-single #content .area-detail h1, #page.area-single #content .area-selecttype .area-find p:first-child {
    line-height: 1.3;
    margin: 0 0 10px;
    font-size: 23px;
    font-weight: normal;
}
#page.area-single #content .area-detail h1 {
    margin: 12px 0 10px;
}
#page.area-single #content .area-detail div.d-sns-button {
    float: right;
    margin: 8px -10px 0 0;
}
#page.area-single #content .area-detail div.confirm.low {
    width: 396px;
    border: 0;
    float: right;
}
#page.area-single #content .area-detail div.confirm.low dl {
    overflow: hidden;
    padding: 0;
    /*background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/bg_confirm.gif) no-repeat left bottom;*/
    background: #E1E1E1;
    border: 0;
    margin: 0 0 2px 0;
}
#page.area-single #content .area-detail div.confirm.low dl dt {
    width: 125px;
    padding: 14px 14px 14px 20px;
    background: #E1E1E1;
    /*background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/bg_confirm_w.gif) no-repeat left top;*/
}
#page.area-single #content .area-detail div.confirm.low dl dd {
    margin: 0 0 0 160px;
    background: #FFFFFF;
    padding: 14px 14px 14px 20px;
    border-left: solid 1px #F7F7F7;
}
#page.area-single #content .area-detail div.confirm.low dl:last-child dd{
    padding: 10px;
    min-height: 24px;
}
#page.area-single #content .area-detail div.confirm.low dl:last-child dd .search-special{
    display: block;
    padding: 0;
    border: 0;
}
#page.area-single #content .area-detail div.confirm.low dl:last-child dd .special-checkbox{
    display: block;
    margin: 0;
    width: 100%;
}
#page.area-single #content .area-detail div.confirm.low dl:last-child dd .special-checkbox label{
    margin: 3px 6px 3px 0;
    cursor:default;
}
#page.area-single #content .area-detail div.confirm.low dl dd img.flag {
    margin: 0 12px 0 0;
    vertical-align: -5px;
}
#page.area-single #content .area-detail div.confirm.low ul.type {
    overflow: hidden;
    padding: 12px;
    border-bottom: 1px #c7c7c7 solid;
}
#page.area-single #content .area-detail div.confirm.low ul.type li {
    float: left;
    margin: 12px 6px 0 0;
    width: 120px;
    height: 15px;
    padding: 2px 0px;
    text-align: center;
    border-radius:3px ;
    border:1px solid #BBB6B4;
}
#page.area-single #content .area-detail div.confirm.low ul.type li img{
    padding-right:6px;
}
#page.area-single #content .area-detail div.confirm.low ul.type li:first-child, #page.area-single #content .area-detail div.confirm.low ul.type li:first-child + li {
    margin: 0 6px 0 0;
}
#content > div > div.confirm.low > ul > li.recommend {
    background: #56D6B9;
}
#content > div > div.confirm.low > ul > li.veteran {
    background: #FF7272;
}
#content > div > div.confirm.low > ul > li.jpsenior {
    background: #6C8FF2;
}
#content > div > div.confirm.low > ul > li.toeic {
    background: #D7673F;
}

#page.area-single #content .area-detail div.profile {
    width: 320px;
}
#page.area-single #content .area-detail div.profile img.profile-pic {
    width: 320px;
    border: 1px #dbdbdb solid;
}
#page.area-single #content .area-detail div.profile p {
    float: right;
    margin: 6px 0 0;
}
/**********************box-btn**************************/
#page.area-single #content .area-detail div.profile .box-btn{
    display: inline-block;
    width: 100%;
    margin: 10px 0 15px 0;
}
#page.area-single #content .area-detail div.profile .box-btn li{
    display: inline-block;
    float: left;
    text-align: center;
}
#page.area-single #content .area-detail div.profile .box-btn li:nth-of-type(1){
    margin-right: 10px;
}
#page.area-single #content .area-detail div.profile .box-btn li span a{
    display: inline-block;
    position: relative;
    height: 32px;
    /*line-height: 34px;*/
    width: auto;
    background: #555555;
    border-radius: 4px;
    color: #FFFFFF;
    vertical-align: middle;
}
#page.area-single #content .area-detail div.profile .box-btn li span a > span{
    position: relative;
    top: 9px;
}
#page.area-single #content .area-detail div.profile .box-btn li span a:hover{
    opacity: .7;
}
#page.area-single #content .area-detail div.profile .box-btn li .btn-bookmark a{
    position: relative;
    background: #F78CCE;
    width: 150px;
}
#page.area-single #content .area-detail div.profile .box-btn li .btn-movie a{
    background: #E4151F;
    width: 155px;
}
#page.area-single #content .area-detail div.profile .box-btn li span > a > i{
    display: inline-block;
    position: relative;
    vertical-align: middle;
}
#page.area-single #content .area-detail div.profile .box-btn li .btn-bookmark a > .ico{
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/detail/ico_bookmark_star.png') 0 0 no-repeat;
    position: absolute;
    top: 7px;
    left: 16px;
    height: 17px;
    width: 17px;
}
#page.area-single #content .area-detail div.profile .box-btn li .btn-bookmark.on a > .ico{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/detail/ico_bookmark_star.png') -17px 0 no-repeat;
}
#page.area-single #content .area-detail div.profile .box-btn li .btn-movie a > .ico{
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/detail/ico_movie_white.png') 0 0 no-repeat;
    position: absolute;
    top: 9px;
    left: 32px;
    width: 20px;
    height: 15px;
}
#page.area-single #content .area-detail div.profile .box-btn li .btn-movie a > span{
    display: inline-block;
    margin: 0 0 0 32px;
}
#page.area-single #content .area-detail div.profile .box-btn li:first-of-type a {
    position: relative;
    background: #F78CCE;
    width: 155px;
    line-height: 32px;
}
#page.area-single #content .area-detail div.profile .box-btn li:first-of-type a img {
    position: relative;
    top: 7px;
    right: 8px;
    width: 18px;
}
#page.area-single #content .area-detail div.profile .box-btn-jp {
    display: block;
    width: 100%;
    margin: 10px 0 15px 0;
}
#page.area-single #content .area-detail div.profile .box-btn-jp li{
    display: block;
    text-align: center;
}
#page.area-single #content .area-detail div.profile .box-btn-jp li span a{
    display: block;
    position: relative;
    height: 36px;
    width: auto;
    background: #555555;
    border-radius: 4px;
    color: #FFFFFF;
    vertical-align: middle;
}
#page.area-single #content .area-detail div.profile .box-btn-jp li span a > span{
    position: relative;
    top: 9px;
}
#page.area-single #content .area-detail div.profile .box-btn-jp li span a:hover{
    opacity: .7;
}
#page.area-single #content .area-detail div.profile .box-btn-jp li .btn-movie a{
    background: #E4151F;
    width: 100%;
}
#page.area-single #content .area-detail div.profile .box-btn-jp li span > a > i{
    display: block;
    position: relative;
    vertical-align: middle;
}
#page.area-single #content .area-detail div.profile .box-btn-jp li .btn-movie a > .ico{
    content: "";
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/detail/ico_movie_white.png') 0 0 no-repeat;
    position: absolute;
    top: 10px;
    left: 102px;
    width: 20px;
    height: 15px;
}
#page.area-single #content .area-detail div.profile .favorite-list dl {
    display: block;
    width: 155px;
    height: 90px;
    padding-top: 15px;
    background: #FFFFFF;
    box-sizing: border-box;
}
#page.area-single #content .area-detail div.profile .favorite-list-jp dl {
    display: block;
    width: 100%;
    height: 90px;
    padding-top: 15px;
    background: #FFFFFF;
    box-sizing: border-box;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:first-of-type {
    float: left;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:last-of-type {
    float: right;
}
#page.area-single #content .area-detail div.profile .favorite-list dl dt,
#page.area-single #content .area-detail div.profile .favorite-list-jp dl dt {
    font-size: 12px;
    line-height: 12px;
    font-weight: bold;
    text-align: center;
    color: #666666;
}
#page.area-single #content .area-detail div.profile .favorite-list dl dd {
    padding-top: 15px;
}
#page.area-single #content .area-detail div.profile .favorite-list-jp dl dd {
    padding-top: 10px;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:first-of-type dd ul {
    height: 14px;
    text-align: center;
}
#page.area-single #content .area-detail div.profile .favorite-list-jp dl:first-of-type dd ul {
    height: 16px;
    text-align: center;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:first-of-type dd ul li {
    display: inline-block;
    width: 13px;
}
#page.area-single #content .area-detail div.profile .favorite-list-jp dl:first-of-type dd ul li {
    display: inline-block;
    width: 16px;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:first-of-type dd ul li img,
#page.area-single #content .area-detail div.profile .favorite-list-jp dl:first-of-type dd ul li img {
    width: 100%;
    vertical-align: top;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:first-of-type dd ul li:last-of-type,
#page.area-single #content .area-detail div.profile .favorite-list-jp dl:first-of-type dd ul li:last-of-type {
    width: auto;
    font-size: 14px;
    line-height: 14px;
    color: #FFC841;
    font-weight: bold;
    padding-left: 4px;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:first-of-type dd ul li ~ li,
#page.area-single #content .area-detail div.profile .favorite-list-jp dl:first-of-type dd ul li ~ li {
    padding-left: 2px;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:first-of-type dd p,
#page.area-single #content .area-detail div.profile .favorite-list-jp dl:first-of-type dd p {
    font-size: 12px;
    line-height: 12px;
    float: none;
    text-align: center;
    margin-top: 0;
    padding-top: 8px;
    color: #777777;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:last-of-type dd p {
    width: 100%;
    font-size: 14px;
    line-height: 14px;
    text-align: center;
    color: #707070;
    float: none;
    margin-top: 0;
}
#page.area-single #content .area-detail div.profile .favorite-list dl:last-of-type dd p img {
    width: 20px;
    position: relative;
    top: -2px;
    right: 5px;
    vertical-align: top;
}

/**********************box-rating**************************/
#page.area-single #content .area-detail div.profile .box-stat{
    display: block;
    width: 100%;
    clear: both;
}
#page.area-single #content .area-detail div.profile .box-stat li{
    display: inline-block;
    float: left;
    width: 105px;
    height: 100px;
    background: #FFFFFF;
    margin: 0 2px 0 0 ;
    padding: 10px 0;
    text-align: center;
    font-size: 12px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page.area-single #content .area-detail div.profile .box-stat li:last-child{
    margin: 0;
}
#page.area-single #content .area-detail div.profile .box-stat li p,
#page.area-single #content .area-detail div.profile .box-stat li span{
    display: block;
    float: none;
    clear: both;
}
#page.area-single #content .area-detail div.profile .box-stat li span{
    display: inline-block;
    width: 70%;
    height: 30px;
    line-height: 30px;
    background: #F7F7F7;
    margin: 4px 0 0;
    font-size: 14px;
    color: #454545;
    border-radius: 2px;
    letter-spacing: 2px;
}

#page.area-single #content .area-detail div.profile .box-stat li p{
    margin: 4px 0 0 0;
}

#page.area-single #content .area-detail div.profile p a.bt-movie {
    display: block;
    padding: 9px 0 4px 38px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/detail/ico_movie_on.png) no-repeat 0 5px;
    color: #e20;
    font-weight: bold;
    text-decoration: none;
    position: relative;
    top:-2px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#page.area-single #content .area-detail div.profile p a.bt-movie:hover {
    opacity: 0.5;
    -moz-opacity: 0.5;
    filter: alpha(opacity=100);
}
#page.area-single #content .area-detail ul.area-bookmark {
    line-height: 18px;
    overflow: hidden;
    margin: 8px 0 0 0;
}
#page.area-single #content .area-detail ul.area-bookmark li {
    float: left;
}
#page.area-single #content .area-detail ul.area-bookmark li + li {
    margin: 0 0 0 10px;
}
#page.area-single #content .area-detail ul.area-bookmark li span {
    display: inline-block;
    position: relative;
    padding: 3px 6px;
    border: 1px #afafaf solid;
    border-radius: 5px;
    font-size: 14px;
    font-weight: bold;
}
#page.area-single #content .area-detail ul.area-bookmark li span img {
    display: block;
    position: absolute;
    top: 50%;
    left: -6px;
    margin: -4px 0 0;
}
#page.area-single #content .area-detail ul.area-bookmark li:nth-child(1) {
    width: 140px;
    text-align: center;
}
#page.area-single #content .area-detail ul.area-bookmark li #registered_teacher {
    background: #EDEDED;
    color: #787878!important;
    font-weight: bold;
    border: 1px solid #B2B2B2;
}
#page.area-single #content .area-detail ul.area-bookmark li #registered_teacher_on {
    font-weight: bold;
    background: #5A5A5A!important;
    color: #FFFFFF!important;
    border: 1px solid #4C4C4C!important;
}

/* ========================================================= [ #page.area-skype-guide] */
#page.area-skype-guide #content ol.tab{
    overflow: hidden;
    padding-left: 14px;
}
#page.area-skype-guide #content ol.tab li{
    background: #cce5ee url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/skype/ico_step01.png') no-repeat 3px 3px;
    border-radius: 5px 5px 0 0;
    float: left;
    margin-right: 10px;
    width: 168px;
}
#page.area-skype-guide #content ol.tab li:hover{
    background-color: #99e5ff;
}
#page.area-skype-guide #content ol.tab li:hover a{
    color: #ffffff;
}
#page.area-skype-guide #content ol.tab li:nth-child(2){
    background-image: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/skype/ico_step02.png');
}
#page.area-skype-guide #content ol.tab li:nth-child(3){
    background-image: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/skype/ico_step03.png');
}
#page.area-skype-guide #content ol.tab li:nth-child(4){
    background-image: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/skype/ico_step04.png');
}
#page.area-skype-guide #content ol.tab li.on {
    background-color: #70d1f3;
}
#page.area-skype-guide #content ol.tab li.on a{
    color: #ffffff;
}
#page.area-skype-guide #content ol.tab li a {
    color: #6c8f9b;
    display: block;
    font-size: 17px;
    font-weight: bold;
    letter-spacing: 1px;
    padding: 10px 0 7px 34px;
    text-align: center;
    text-decoration: none;
}
#page.area-skype-guide #content .sect-box {
    border-radius: 0 0 5px 5px;
    border-top: 5px #70d1f3 solid;
    padding: 30px 30px 50px;
}
#page.area-skype-guide #content .sect-box p.lead {
    margin-bottom: 30px;
}
#page.area-skype-guide #content .sect-box ol li {
    overflow: hidden;
    margin-bottom: 30px;
    font-size: 13px;
    line-height: 1.7;
}
#page.area-skype-guide #content .sect-box ol li a {
    color: #2FA6F5!important;
    text-decoration: underline;
}

#page.area-skype-guide #content .sect-box ol li img:first-child {
    float: left;
    margin-right: 20px;
}
/* Skype Guide Sount Test*/
#page.skype-guide-sound #content .sect-items {
    margin-bottom: 40px;
    padding: 30px;
    border-radius: 5px;
    background: #e8f5fb;
    text-align: center;
}
#page.skype-guide-sound #content .sect-items > p {
    margin-bottom: 5px;
}
#page.skype-guide-sound #content .sect-items ul li {
    display: inline;
    margin-left: 30px;
}
#page.skype-guide-sound #content .sect-items ul li:first-child {
    margin-left: 0;
}
/* Skype Guide Operation */
#page.skype-guide-operation #content .sect-box > ol{
    margin-bottom: 50px;
}
#page.skype-guide-operation #content .sect-explainicons > p:first-child{
    background: #cce5ee;
    border-radius: 4px;
    margin-bottom: 20px;
    padding: 10px;
}
#page.skype-guide-operation #content .sect-explainicons h3{
    background: #cce5ee;
    border-radius: 4px;
    color: #6c8f9b;
    font-size: 17px;
    margin-bottom: 20px;
    padding: 10px;
}
#page.skype-guide-operation #content .sect-explainicons ol {
    margin-bottom: 30px;
    overflow: hidden;
}
#page.skype-guide-operation #content .sect-explainicons ol li {
    float: left;
    height: 62px;
    width: 330px;
}
#page.skype-guide-operation #content .sect-explainicons ol li p:first-child {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/skype/num_icons.png') no-repeat 0 0;
    font-size: 16px;
    height: 18px;
    margin-bottom: 8px;
    padding-left: 25px;
}
#page.skype-guide-operation #content .sect-explainicons ol li:nth-child(2) p:first-child {
    background-position: 0 -30px;
}
#page.skype-guide-operation #content .sect-explainicons ol li:nth-child(3) p:first-child {
    background-position: 0 -60px;
}
#page.skype-guide-operation #content .sect-explainicons ol li:nth-child(4) p:first-child {
    background-position: 0 -90px;
}
#page.skype-guide-operation #content .sect-explainicons ol li:nth-child(5) p:first-child {
    background-position: 0 -120px;
}
#page.skype-guide-operation #content .sect-explainicons ol li:nth-child(6) p:first-child {
    background-position: 0 -150px;
}
#page.skype-guide-operation #content .sect-explainicons ol li:nth-child(7) p:first-child {
    background-position: 0 -180px;
}
#page.skype-guide-operation #content .sect-explainicons ol li:nth-child(8) p:first-child {
    background-position: 0 -210px;
}

/* ========================================================= [ #page.area-single .area-detail.area-concierge] */
#page.area-single #content .area-detail.area-concierge div.period {
    overflow: hidden;
    margin: 0 0 30px;
    padding: 0 0 30px;
    border-bottom: 1px #ddd solid;
}
#page.area-single #content .area-detail.area-concierge div.period h3{
    border-left: 6px solid #70d1f3;
    font-size: 21px;
    margin-bottom: 8px;
    padding-left: 8px;
}
#page.area-single #content .area-detail.area-concierge div.period h3 span{
    font-size: 12px;
    font-weight: normal;
    margin-left: 19px;
}
#page.area-single #content .area-detail.area-concierge div.profile {
    margin: 0;
}
#page.area-single #content .area-detail.area-concierge div.free_consultation {
    width: 395px;
    margin: 0 0 0 340px;
}
#page.area-single #content .area-detail.area-concierge div.free_consultation h1{
    font-size: 28px;
    font-weight: bold;
    line-height: 46px;
}
#page.area-single #content .area-detail.area-concierge div.free_consultation h1 img{
    float: left;
    margin-right: 16px;
    padding-top: 11px;
}
#page.area-single #content .area-detail.area-concierge div.free_consultation h1 span{
    display: block;
    font-size: 38px;
    text-indent: -17px;
}
#page.area-single #content .area-detail.area-concierge div.free_consultation p {
    line-height: 1.8;
    margin: 30px 0 0;
}
#page.area-single #content div.other_contents p {
    margin: 0 0 20px;
    font-size: 14px;
    font-weight: bold;
}
#page.area-single #content div.other_contents ul {
    border: 5px #ddd solid;
}
#page.area-single #content div.other_contents ul li{
    background: #f1f1f1;
    background: -moz-linear-gradient(top, #f1f1f1 0%, #ebebeb 100%);
    background: -webkit-linear-gradient(top, #f1f1f1 0%,#ebebeb 100%);
    background: linear-gradient(to bottom, #f1f1f1 0%,#ebebeb 100%);
    border-top: 3px solid #fbfbfb;
    border-bottom: 3px solid #bebebe;
}
#page.area-single #content div.other_contents ul li:hover{
    background: #e4e4e4;
    color: #727272;
}
#page.area-single #content div.other_contents ul li:hover dd{
    color: #ff7f32;
}
#page.area-single #content div.other_contents ul li a{
    text-decoration: none;
    color: inherit;
}
#page.area-single #content div.other_contents ul li dl{
    padding: 14px 19px 7px;
}
#page.area-single #content div.other_contents ul li dl dt{
    float: left;
    font-size: 15px;
    padding-left: 32px;
    position: relative;
    width: 51%;
}
#page.area-single #content div.other_contents ul li dl dt:before{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ico_check.png') no-repeat;
    content: "";
    height: 22px;
    left: 0;
    position: absolute;
    top: -4px;
    width: 21px;
}
#page.area-single #content div.other_contents ul li dl dd{
    color: #555555;
    font-size: 19px;
    font-weight: bold;
    position: relative;
    top: -2px;
}
#page.area-single #content div.other_contents ul li dl dd:before{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ico_arrow_r.png') no-repeat;
    content: "";
    height: 24px;
    left: 12px;
    margin: auto;
    position: absolute;
    right: 0;
    top: 1px;
    width: 33px;
}
#page.area-single #content .area-detail.area-concierge div.faq p:first-child, #page.area-single #content .area-detail.area-concierge div.news p:first-child {
    margin: 0 0 20px;
}
#page.area-single #content .area-detail.area-concierge div.faq ul, #page.area-single #content .area-detail.area-concierge div.news dl {
    margin: 0 0 30px;
}
#page.area-single #content .area-detail.area-concierge div.faq ul li {
    margin: 0 0 10px;
}
#page.area-single #content .area-detail.area-concierge div.news dl {
    overflow: hidden;
}
#page.area-single #content .area-detail.area-concierge div.news dl dt {
    float: left;
    width: 9em;
    padding: 4px;
    background: #ddd;
}
#page.area-single #content .area-detail.area-concierge div.news dl dd {
    margin: 0 0 10px 10em;
    padding: 4px;
}
#page.area-single #content .area-detail.area-concierge div.area-search ul.search-time li {
    width: 126px;
}
/* ========================= tab-navi */
#page.area-single #content .area-detail .tab-navi {
    overflow: hidden;
    margin: 0 0 20px;
    border-bottom: 6px #60bfe9 solid;
}
/* ========================= tab-content */
#page.area-single #content .area-detail .tab-navi ul li {
    float: left;
    width: 160px;
    margin: 0 6px 0 0;
    border: solid 1px #CCCCCC;
    border-bottom: 0;
    border-radius: 5px 5px 0 0;
    background: #FFFFFF;
    text-align: center;
}
#page.area-single #content .area-detail .tab-navi ul li a {
    position: relative;
    top:-2px;
    display: block;
    height: 14px;
    padding: 8px 0;
    border-radius: 5px 5px 0 0;
    text-decoration: none;
    font-size: 14px;
    font-weight: 300;
    opacity: 1.0;
    color: #666;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#page.area-single #content .area-detail .tab-navi ul li a:hover {
    opacity: 0.7;
    color: #666;
}
#page.area-single #content .area-detail .tab-navi ul li.on {
    background: #60bfe9;
    border-color: #60bfe9;
}

#page.area-single #content .area-detail .tab-navi ul li.on a {
    color: #fff;
    text-decoration: none;
}

#page.area-single #content .area-detail .tab-navi ul li:first-child + li.on {
    background: #60bfe9;
    border-color: #60bfe9;
}

#page.area-single #content .area-detail .tab-navi ul li:first-child + li + li.on {
    background: #60bfe9;
    border-color: #60bfe9;
}

#page.area-single #content .area-detail .tab-navi ul li.on img {
    visibility: hidden;
}
/* ========================= tab-content */
#page.area-single #content .area-detail .tab-content {
    display: none;
    margin: 0 10px 40px;
}
#page.area-single #content .area-detail #tab03 {
    margin-left: 0;
    margin-right: 0;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info {
    width: 320px;
    height: 200px;
    background: #FFFFFF;
    box-sizing: border-box;
    padding: 15px 10px;
    margin-top: 20px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dt {
    font-size: 14px;
    line-height: 14px;
    color: #666666;
    padding: 0 0 10px 15px;
    border-bottom: 3px solid #F7F7F7;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd {
    padding-top: 15px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd ul {
    list-style-type: none;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li {
    width: 100%;
    padding-left: 15px;
    box-sizing: border-box;
    list-style-type: none;
    list-style-image: url(data:0);
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li ~ li {
    margin-top: 10px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .star {
    font-size: 13px;
    line-height: 13px;
    color: #333333;
    padding-right: 10px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .star img {
    width: 12px;
    vertical-align: top;
    position: relative;
    top: 2px;
    padding: 0 5px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage {
    position: relative;
    display: inline-block;
    width: 165px;
    height: 10px;
    border-radius: 5px;
    background: #E5E5E5;
    margin-right: 10px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage::after {
    content: '';
    height: 10px;
    border-radius: 5px;
    background: #FFC841;
    position: absolute;
    left: 0;
    top: 0;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per5::after  {
    width: 5%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per10::after  {
    width: 10%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per15::after  {
    width: 15%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per20::after  {
    width: 20%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per25::after  {
    width: 25%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per30::after  {
    width: 30%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per35::after  {
    width: 35%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per40::after  {
    width: 40%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per45::after  {
    width: 45%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per50::after  {
    width: 50%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per55::after  {
    width: 55%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per60::after  {
    width: 60%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per65::after  {
    width: 65%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per70::after  {
    width: 70%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per75::after  {
    width: 75%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per80::after  {
    width: 80%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per85::after  {
    width: 85%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per90::after  {
    width: 90%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per95::after  {
    width: 95%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .gage.per100::after  {
    width: 100%;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .total_star {
    display: inline-block;
    font-size: 13px;
    line-height: 13px;
    letter-spacing: -0.5px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .total_star.bluer {
    color: #2FA8F5;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .evaluation-info dd li .total_star.bluer:hover {
    cursor: pointer;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .total_comments {
    font-size: 12px;
    line-height: 12px;
    color: #717171;
    margin-top: 40px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments {
    margin-top: 25px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments ~ .comments {
    margin-top: 45px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .c_name {
    position: relative;
    font-size: 12px;
    line-height: 12px;
    color: #333333;
    padding-left: 18px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .c_name::after {
    content: '';
    width: 12px;
    height: 14px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/sp/general/eikaiwa/detail/ico_user.png);
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .c_time {
    display: inline-block;
    height: 12px;
    position: relative;
    font-size: 12px;
    line-height: 12px;
    color: #333333;
    margin-left: 55px;
    padding-left: 18px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .c_time::after {
    content: '';
    width: 12px;
    height: 12px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/sp/general/eikaiwa/detail/ico_time.png);
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .stars {
    float: right;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .stars li {
    display: inline-block;
    list-style-type: none;
    list-style-image: url(data:0);
    width: 15px;
    margin: 0 2px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .stars li ~ li {
    padding-left: 2px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dt .stars li img {
    width: 100%;
    vertical-align: top;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dd {
    position: relative;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    background: #FFFFFF;
    color: #5C5C5C;
    border-radius: 5px;
    margin-top: 15px;
    padding: 15px 20px;
    box-sizing: border-box;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .comments dd::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-bottom: 10px solid #FFFFFF;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    top: -10px;
    left: 10px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .total_pages {
    font-size: 12px;
    line-height: 12px;
    margin-top: 30px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation {
    display: block;
    width: 100%;
    margin-top: 25px;
    text-align: center;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation li {
    display: inline-block;
    list-style-type: none;
    list-style-image: url(data:0);
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation li a {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 15px;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation li a:hover {
    background: #cccccc;
    color: #FFFFFF;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation li a.on {
    background: #cccccc;
    color: #FFFFFF;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation li:last-of-type a {
    width: auto;
    border: none;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation li:last-of-type a:hover {
    background: none;
    color: #000;
}
#page.area-single #content .area-detail .tab-content .area-ratecomment .c_pagenation li ~ li {
    margin-left: 10px;
}

/* ↓↓ teacher/index/index.html & no_attend.html Add Recent Memo & Lesson History Contents CSS 2017/02/27. ↓↓ */
#page.area-single #content .area-detail .tab-navi ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

#page.area-single #content .area-detail .tab-navi ul li {
    float: none;
    width: 178px;
    margin: 0;
    box-sizing: border-box;
}

#recent_memo {
    position: relative;
    width: 320px;
    height: 160px;
    margin: 10px 0 0;
    background-color: #fff;
}

#recent_memo dl {
    padding: 14px 0 0;
}

#recent_memo dl dt {
    width: 100%;
    margin: 0 0 4px;
    text-align: center;
    letter-spacing: 0;
    color: #666666;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.53846153846154em;
}

#recent_memo dl dd {
    width: 290px;
    height: 65px;
    margin: 0 auto;
    font-size: 12px;
    line-height: 1.33333333333333em;
    overflow: hidden;
}

#recent_memo a {
    position: absolute;
    right: 15px;
    bottom: 12px;
    letter-spacing: 0.08em;
    color: #29abe2;
    font-size: 12px;
}

#tab01.tab-content {
    margin-top: -22px !important;
    margin-right: -3px !important;
    margin-left: -2px !important;
}

#tab01.tab-content .area-lessonhistory {
    width: 100%;
}

#tab01.tab-content .area-lessonhistory table#on_history {
    width: 100%;
}

#tab01.tab-content .area-lessonhistory table#on_history tr {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

#tab01.tab-content .area-lessonhistory table#on_history tr:nth-of-type(even) {
    background-color: #f7f7f7;
}

#tab01.tab-content .area-lessonhistory table#on_history tr:nth-of-type(odd) {
    background-color: #fff;
}

#tab01.tab-content .area-lessonhistory table#on_history tr th {
    box-sizing: border-box;
    height: 50px;
    text-align: center !important;
    vertical-align: middle !important;
    letter-spacing: 0.11em;
    background-color: #e1e1e1;
    font-size: 14px;
    font-weight: normal;
    line-height: 58px;
    padding: 0;
    color: #000;
}

#tab01.tab-content .area-lessonhistory table#on_history tr th:first-of-type {
    width: 27.5%;
}

#tab01.tab-content .area-lessonhistory table#on_history tr th:nth-of-type(2) {
    width: 32.5%;
}

#tab01.tab-content .area-lessonhistory table#on_history tr th:nth-of-type(3) {
    width: 15%;
}

#tab01.tab-content .area-lessonhistory table#on_history tr th:last-of-type {
    width: 25%;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td {
    font-size: 12px;
    padding: 0;
    text-align: center !important;
    height: 41px;
    line-height: 41px;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td a {
    opacity: 1;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td a:hover {
    opacity: 0.75;
    -webkit-transition: opacity 0.5s;
    transition: opacity 0.5s;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td:first-of-type {
    width: 27.5%;
    letter-spacing: 0.05em;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td:nth-of-type(2) {
    width: 32.5%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #29abe2;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td:nth-of-type(2) a {
    color: #29abe2;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td:nth-of-type(3) {
    width: 15%;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td:nth-of-type(3) img {
    width: 12px;
    vertical-align: middle;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td:last-of-type {
    width: 25%;
}

#tab01.tab-content .area-lessonhistory table#on_history tr td:last-of-type a.button {
    width: 138px;
    height: 25px;
    color: #fff;
    background-color: #60bfe9;
    border-radius: 12px;
    display: inline-block;
    line-height: 25px;
}

#tab01.tab-content .area-lessonhistory #history_none {
    height: 87px;
}

#tab01.tab-content .area-lessonhistory #history_none p {
    font-size: 14px;
    text-align: center;
    color: #999999;
    height: 100%;
    line-height: 130px;
}
#tab01.tab-content .area-lessonhistory .total_pages {
    font-size: 12px;
    line-height: 12px;
    margin: 20px 0 0 5px;
}
#tab01.tab-content .area-lessonhistory .c_pagenation {
    display: block;
    width: 100%;
    margin-top: 20px;
    text-align: center;
}
#tab01.tab-content .area-lessonhistory .c_pagenation li {
    display: inline-block;
    list-style-type: none;
    list-style-image: url(data:0);
}
#tab01.tab-content .area-lessonhistory .c_pagenation li a {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 15px;
}
#tab01.tab-content .area-lessonhistory .c_pagenation li a:hover {
    background: #cccccc;
    color: #FFFFFF;
}
#tab01.tab-content .area-lessonhistory .c_pagenation li a.on {
    background: #cccccc;
    color: #FFFFFF;
}
#tab01.tab-content .area-lessonhistory .c_pagenation li.terminal a {
    width: auto;
    border: none;
}
#tab01.tab-content .area-lessonhistory .c_pagenation li:last-of-type a:hover {
    background: none;
    color: #000;
}
#tab01.tab-content .area-lessonhistory .c_pagenation li ~ li {
    margin-left: 10px;
}
/* ↑↑ teacher/index/index.html & no_attend.html Add Recent Memo & Lesson History Contents CSS 2017/02/27 End. ↑↑ */

/* ========================================================= [ #page.area-single .area-selecttype ] */
#page.area-single #content .area-selecttype h1 {
    overflow: hidden;
    line-height: 1.3;
    margin: 10px 0 30px;
    padding: 0 0 30px;
    border-bottom: 2px #dfdfdf solid;
    background: none;
    font-size: 22px;
    font-weight: bold;
}
#page.area-single #content .area-selecttype h1 > img {
    float: left;
    margin: 0 12px 0 0;
}
#page.area-single #content .area-selecttype h1 > span {
    font-size: 10px;
}
#page.area-single #content .area-selecttype ul.type-list {
    overflow: hidden;
}
#page.area-single #content .area-selecttype ul.type-list li {
    float: left;
    margin: 0 0 15px 5px;
}
#page.area-single #content .area-selecttype ul.type-list li:first-child {
    margin: 0 0 15px;
}
#page.area-single #content .area-selecttype ul.type-list li a {
    display: block;
}
#page.area-single #content .area-selecttype ul.type-list li div.portrait p.teacherdetail {
    margin: 6px 0 0;
}
#page.area-single #content .area-selecttype .area-find {
    padding: 20px;
    font-weight: normal;
}
#page.area-single #content .area-selecttype .area-find div {
    overflow: hidden;
}
#page.area-single #content .area-selecttype .area-find div p {
    margin: 0 0 20px 220px;
}
/* ========================================================= [ #page.area-flow ] */
/* ========================= fig-flow */
#page.area-flow .fig-flow {
    width: 670px;
    margin: 0 auto 20px;
}
#page.area-flow .fig-flow ul {
    overflow: hidden;
}
#page.area-flow .fig-flow ul li {
    position: relative;
    float: left;
    width: 26%;
    height:34px;
    margin-left: 12px;
    margin-right: 30px;
    padding: 6px 0px 6px 30px;
    background: #7a98a5;
    border-radius: 6px 0 0 6px;
    font-size: 16px;
    color: #fff;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    text-align: center;
}
#page.area-flow .fig-flow ul li:before {
    display: inline-block;
    position: absolute;
    left:10px;
    background: #fff;
    border-radius: 20px;
    width: 20px;
    height:20px;
    text-align: center;
    line-height: 23px;
    font-size: 14px;
    font-weight: bold;
    color: #333;
}
#page.area-flow .fig-flow ul li:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    right: -30px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 17px 0 17px 30px;
    border-color: transparent transparent transparent #7a98a5;
}
#page.area-flow .fig-flow ul li.on {
    background: #fabe00;
}
#page.area-flow .fig-flow ul li.on:after  {
    border-color: transparent transparent transparent #fabe00;
}
#page.area-flow .fig-flow ul li:first-child:before {
    content: "1";
}
#page.area-flow .fig-flow ul li+li:before {
    content: "2";
}
#page.area-flow .fig-flow ul li+li+li:before {
    content: "3";
}
/* ========================= bx-bt */
#page.area-flow #content div.bx-bt {
    padding: 30px 0;
    border-radius: 5px;
    text-align: center;
}
#page.area-flow #content div.bx-bt-withdrawal {
    padding: 20px 0;
    border-radius: 5px;
    text-align: center;
}
#page.area-flow #content div.bx-bt input + input, #page.area-flow #content div.bx-bt a + a {
    margin: 0 0 0 40px;
}
#page.area-flow #content div.bx-bt p {
    margin: 10px 0 0;
}
#page.area-flow #content div.bx-bt p.processing {
    margin: 0;
    padding: 10px 35px;
    color: #c00;
    font-size: 14px;
    font-weight: bold;
}
/* ========================= ul.caution */
#page.area-flow #content ul.caution {
    list-style: disc;
}
#page.area-flow #content ul.caution li {
    margin: 6px 0 3px 20px;
}
/* ========================= area-attention */
#page.area-flow #content div.area-attention {
    margin-bottom: 30px;
    padding: 20px;
    background: #eee;
    border-radius: 12px;
}
#page.area-flow #content div.area-attention h2 {
    padding: 0;
    border-left: none;
    background: none;
}
#page.area-flow #content div.area-attention.lessoncancel .sect ul.time {
    margin: 20px 0;
}
#page.area-flow #content div.area-attention.lessoncancel .sect ul.time li {
    margin-bottom: 12px;
    font-size: 14px;
}
#page.area-flow #content div.area-attention.lessoncancel .sect ul.time li:before {
    content: "・";
    display: inline-block;
    margin: 0 3px;
}
#page.area-flow #content div.area-attention.lessoncancel .sect .txt {
    color: #666;
}
#page.area-flow #content div.area-attention.lessoncancel .sect .link {
    xmargin-top: 20px;
    margin: 20px -10px -10px;
    background: #fff;
    border-radius: 12px;
    text-align: center;
}
#page.area-flow #content div.area-attention.lessoncancel .sect .link a {
    display: inline-block;
    margin: 12px;
    font-size: 14px;
}
/* ========================= area-input */
#page.area-flow #content div.area-input .box-skype-test {
    margin: 20px 0 6px;
    padding: 12px 20px;
    border: 2px solid #d0d0d0;
    border-radius: 12px;
}
#page.area-flow #content div.area-input .box-skype-test .ttl {
    margin: 6px 0;
    font-size: 16px;
    text-align: center;
}
#page.area-flow #content div.area-input .box-skype-test .btn-skype > span {
    display: block;
    margin: 8px 0;
    padding: 10px 0 4px;
    background: #ecf7fd;
    border-radius: 50px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    line-height: 20px;
    color: #00AFF0;
    cursor: pointer;
}
#page.area-flow #content div.area-input .box-skype-test .btn-skype span span {
    display: block;
    font-size: 11px;
    font-weight: normal;
}
#page.area-flow #content div.area-input .box-skype-test .btn-skype img {
    margin: 12px !important;
}
#page.area-flow #content div.area-input .box-skype-test .txt {
    line-height: 1.4;
}
/* ========================= area-questionnaire */
#page.area-flow #content div.area-questionnaire {
    margin: 20px 0 0 0 !important;
}
#page.area-flow #content div.area-questionnaire a.payment-link {
    text-decoration: underline;
}
#page.area-flow #content div.area-questionnaire h2 {
    padding: 0;
    border-left: none;
}
#page.area-flow #content div.area-questionnaire ol {
    margin: 20px;
}
#page.area-flow #content div.area-questionnaire ol > form > li {
    margin: 20px 0;
}
#page.area-flow #content div.area-questionnaire ol > form > li > ul > li {
    padding: 8px 0 0;
}
#page.area-flow #content div.area-questionnaire input {
    display: inline;
    vertical-align: middle;
}

#page.area-flow #content div.area-questionnaire .bx-bt-withdrawal .btn-profile-churn {
    font-size: 18px;
    letter-spacing: 2px;
    padding: 8px 12px;
}
/* ========================= #popup-limit */
#page #popup-limit {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 30;
}
#page #popup-limit .cover {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0.5;
    z-index: 50;
    filter: alpha(opacity=50);        /* ie 7 */
    -ms-filter: "alpha(opacity=50)";  /* ie 8 */
}
#page #popup-limit .box {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 440px;
    margin: -100px 0 0 -220px;
    padding: 36px 0;
    border: 3px #000 solid;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 2px 6px #000;
    text-align: center;
    z-index: 51;
}
#page #popup-limit .box p.lead {
    margin: 0 0 15px;
    font-size: 18px;
    font-weight: bold;
}
#page #popup-limit .box ul {
    margin: 20px 0 0;
}
#page #popup-limit .box ul li {
    margin-bottom: 6px;
}
#page #popup-limit .box .bt-close {
    position: absolute;
    top: 6px;
    right: 6px;
    cursor: pointer;
}
/* ============================ register, confirm and complete*/
#w #main-pay.page-customer-info #content,
#w #main-pay.page-confirm #content,
#w #main-pay.page-complete #content
{
    font-size: 14px;
    margin: 0 auto;
    max-width: 1060px;
    min-width: 800px;
    padding: 14px 14px 42px;
    width: 1060px;
}
/* ============================ register user confirm*/

/* https://www.dmm.com/css/list.css から抜粋 */
#page #content .area-schedules .list-boxcaptside {
    padding: 6px 12px;
    border-top: 2px #bbb solid;
    background: #ebebeb;
}
#page #content .area-schedules .list-boxpagenation ul {
    /*margin: 0 -4px 1px 0;*/
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    width: 100%;
    float: none;
    text-align:center;
}
#page #content .area-schedules .list-boxpagenation ul li{
    display: inline-block;
    float:none;
}

#page #content .area-schedules .list-boxpagenation ul li span {
    min-width: 24px;
    padding: 2px;
    border: 3px #efbb1d solid;
    background-color: #f1e55a;
}
#page #content .area-schedules .list-boxpagenation .dot {
    padding: 4px;
}
#page #content .area-schedules .list-boxpagenation li a:link, #page #content .area-schedules .list-boxpagenation li a:visited {
    min-width: 24px;
    padding: 4px;
    border: 1px #bbb solid;
    background-color: #fff;
    color: #333;
    text-decoration: none;
}
#page #content .area-schedules .list-boxpagenation li a:hover {
    padding: 2px;
    border: 3px #efbb1d solid;
    background-color: #f1e55a;
    color: #333;
}
#page #content .area-schedules .list-boxcaptside select {
    float: left;
    margin: 2px 10px 0 0;
}
/* https://www.dmm.com/css/list.css から抜粋ここまで */



/* https://www.dmm.com/css/signup.css から抜粋 */
#page.area-flow #content .area-notes {
    margin: 30px 0 0;
    background: #fff;
    color: #666;
    font-size: 11px;
}
#page.area-flow #content .area-notes > .box-verisign, #page.area-flow #content .area-notes > .box-personalinfo {
    width: 624px;
    margin: 0 auto;
    padding: 20px 0;
    border-top: #ccc 1px dotted;
}
#page.area-flow #content .area-notes > div:first-child {
    border: none;
}
#page.area-flow #content .area-notes > div:after {
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
    content: "."
}
#page.area-flow #content .area-notes > .box-verisign .logo {
    float: left;
}
#page.area-flow #content .area-notes > .box-verisign > p {
    margin: 0 0 0 120px;
    padding: 10px 0 0;
}
#page.area-flow #content .area-notes > .box-personalinfo .about {
    text-align: right;
}
#page.area-flow #content .area-notes > .box-personalinfo .about a {
    margin: 0 0 0 20px;
    padding: 0 0 0 14px;
    color: #000;
    font-weight: bold;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/signup/arrow.png) left center no-repeat;
    text-decoration: none;
}
#page.area-flow #content .area-notes > .box-personalinfo a:hover {
    color: #333;
    text-decoration: underline;
}
#page.area-flow #content .area-notes > .arrow:hover {
    text-decoration: underline;
}
/* https://www.dmm.com/css/signup.css から抜粋ここまで */



/* https://www.dmm.com/css/payment.css から抜粋 */
#page.area-flow .dp-box2col .dp-unit {
    float: left;
    width: 45%;
    margin: 12px 12px 12px -1px;
    padding: 0 0 0 9px;
}
#page.area-flow .dp-box2col .dp-unit:first-child {
    width: 48%;
    margin: 12px 0 12px 12px;
    padding: 0 9px 0 0;
}
#page.area-flow .dp-boxnormal {
    padding: 12px;
    border: none;
}
#page.area-flow .dp-item {
    margin: 0;
    padding: 0;
}
#page.area-flow .finishtitle {
    color: #cc0000;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 20px;
}
#page.area-flow .boxannounce {
    padding: 16px 0 0;
    border-top: 1px dotted #999;
    color: #666;
    padding: 16px 16px 0;
    text-align: left;
}
#page.area-flow .boxannounce .capt {
    border-left: 2px solid #666;
    font-weight: bold;
    line-height: 11px;
    padding-left: 6px;
}
#page.area-flow .boxannounce .sect {
    margin: 6px 0 16px;
}
#page.area-flow hr[class*="dp-"][class*="line"] {
    border-width: 1px 0 0;
    height: 1px;
    margin: 22px 0;
}
#page.area-flow hr[class*="dp-"][class*="line-sm"]{margin:12px 0}
#page.area-flow hr[class*="dp-dot"]{border-style: dotted; border-color: #999}
#page.area-flow hr[class*="dp-solid"]{border-style: solid; border-color: #bbb}
/* https://www.dmm.com/css/payment.css から抜粋ここまで */

/*--  add --*/
#w .page-regist h2 {
    padding: 0 !important;
    margin-bottom: 8px !important;
    background: none !important;
}
#w .page-regist .area-course,
#w .page-regist .area-input,
#w .page-regist .area-pay,
#w .page-regist .area-serial,
#w .page-regist #main-pay {
    margin-bottom: 26px;
}
/*-- /end --*/

#w .page-regist .area-cta-button input[type="button"].confirm,
#w .page-regist .area-cta-button input[type="button"].confirm:hover,
#w .page-regist .area-cta-button input[type="button"].next,
#w .page-regist .area-cta-button input[type="button"].next:hover,
#w .page-regist .area-cta-button input[type="button"].join,
#w .page-regist .area-cta-button input[type="button"].join:hover,
#w .page-regist .area-cta-button input[type="button"].change,
#w .page-regist .area-cta-button input[type="button"].change:hover,
#w .page-regist .area-cta-button a.reserve,
#w .page-regist .area-cta-button a.reserve:hover {
    border: none;
    width: 240px;
    height: 40px;
    cursor: pointer;
}
#w .page-regist .area-cta-button a.reserve {
    display: block;
    text-indent: -9999px;
}
#w .page-regist .area-cta-button input[type="button"].confirm {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_confirm.png);
}
#w .page-regist .area-cta-button input[type="button"].confirm:hover {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_confirm.png);
    background-position: 0 -40px;
}
#w .page-regist .area-cta-button input[type="button"].next {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_next.png);
}
#w .page-regist .area-cta-button input[type="button"].next:hover {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_next.png);
    background-position: 0 -40px;
}
#w .page-regist .area-cta-button input[type="button"].join {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_join.png);
}
#w .page-regist .area-cta-button input[type="button"].join:hover {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_join.png);
    background-position: 0 -40px;
}
#w .page-regist .area-cta-button input[type="button"].change {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_change.png);
}
#w .page-regist .area-cta-button input[type="button"].change:hover {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_change.png);
    background-position: 0 -40px;
}
#w .page-regist .area-cta-button a.reserve {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_lessonreserve.png);
}
#w .page-regist .area-cta-button a.reserve:hover {
    background-image: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/bt/eikaiwa_lessonreserve.png);
    background-position: 0 -40px;
}
/*ADDED FOR LIST_TOP.HTML*/
.time-search {
    width: 280px;
    border-right: 1px solid #fff;
    float: left;
}

.pull-right{
    float: right;
}

.pull-left{
    float: left;
}

.clearfix{
    clear: both;
}

.clearfix02::after
{
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}

.time-search p img, .search-condition p img, .search-special p img,
.search-keyword p img{
    padding-left: 16px;
    padding-right: 7px;
    vertical-align: middle;

}
.area-search select, .area-schedules select{
    height: 20px;
    border-radius: 3px;
    border: 1px solid #bbb6b4;
    background: #ffffff;
        background: -moz-linear-gradient(top,  #ffffff 45%, #f0f0f0 98%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(45%,#ffffff), color-stop(98%,#f0f0f0));
        background: -webkit-linear-gradient(top,  #ffffff 45%,#f0f0f0 98%);
        background: -o-linear-gradient(top,  #ffffff 45%,#f0f0f0 98%);
        background: -ms-linear-gradient(top,  #ffffff 45%,#f0f0f0 98%);
        background: linear-gradient(to bottom,  #ffffff 45%,#f0f0f0 98%);
}

.search-special p{
    margin-top: 8px !important;
}

.special-checkbox {
    margin-left: 15px;
    width: 600px;
}

.special-checkbox label{
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #BBB6B4;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 8px;
    margin-right: 10px;
    padding: 4px 8px;
}
.special-checkbox  input[type="checkbox"]{
    opacity: 0;
    position: absolute;
}
.special-checkbox label img{
    vertical-align: middle;
    padding-right: 6px;
}

.search-keyword {
    position: relative;
}

.search-keyword .search-field {
    position: relative;
    width: 286px;
    height: 28px;
    border-radius: 4px;
    border: 1px solid #8A8A8B;
    line-height: 14px;
    padding: 0 10px 0 29px;
    box-sizing: border-box;
}
.search-keyword::after {
     content: '';
     height: 17px;
     width: 17px;
     background-size: cover;
     background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/search_pc.png) no-repeat;
     position: absolute;
     left: 228px;
     top: 23px;
 }

.search-field:focus{
    border-color: #6BBDEB;
}
.search-keyword.center {
    text-align: center;
 }
.search-wrapper.center {
    text-align: center !important;
}
.search-keyword p{
    margin-top: 8px !important;
    margin-right: 13px !important
}

.search-wrapper {
    padding: 7px 0;
}
.search-wrapper .btn-search {
    display: block;
    width: 185px;
    height: 40px;
    line-height: 41px;
    background: #FD7821;
    border-radius: 20px;
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 18px;
    font-weight: bold;
    margin: 0 auto;
    letter-spacing: 3px;
    cursor: pointer;
}
.search-wrapper .btn-search-arrow{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ico_arrow02.png') no-repeat;
    float: left;
    width: 14px;
    height: 14px;
    margin: 4px 10px 0 0;
}

.area-search .search-clear {
    text-decoration: underline;
    margin: 9px auto 18px;
    text-align: center;
}

#tabs1, #tabs2 {
    padding: 0;
}

#tabs {
    font-family: inherit;
}

#tabs .search-tabs{
    background: #fff;
    border: 0;
    border-radius: 0;
    padding: 0px !important;
    border-top: 0px !important;
}

#tabs .search-tabs li {
    border: 0;
    border-radius: 0;
    width: 50%;
}

#tabs .search-tabs li a{
    background: #fff;
    cursor: pointer;
    padding: 14px 0 !important;
    color: #313131 !important;
    font-size: 17px;
    border-bottom: 3px solid #6bbdeb;
    width: 100%;
}

#tabs .search-tabs li.active a,
#tabs .search-tabs li a:focus {
    background: #6bbdeb;
    color: #ffffff !important;
    outline: none;
}

#tabs2 .search-condition p {
    margin-right: 15px;
}

#tabs2 .search-condition select {
    margin-right: 4px;
}
/* ===================== Materials individual page ===========*/
.submit-box {
    margin: 0 auto;
    padding: 10px;
    background: #fff;
}
.submit-box ul {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 600px;
    margin: 0 auto !important;
}
.submit-box ul li {
    font-size: 11px;
}
.submit-box ul li:first-child {
    width: 200px;
    margin: 0 10px 0 0!important;
}
.submit-box ul li img {
    width: 100%;
    height: auto;
}
.submit-box ul li label {
    display: block;
    margin: 0;
    letter-spacing: normal;
    font-size: 11px;
    font-weight: bold;
}
.submit-box ul li label input[type="checkbox"] {
    margin: 0 5px 0 0;
}

/*Re-categorize info*/
.materials-recategorize-info {
    margin: 20px auto;
    padding: 10px 15px;
    background: #FFFFFF;
    border: 2px solid #e30b17;
    font-size: 13px;
    line-height: 1.6;
}

.materials-recategorize-info p {
    font-size: 15px;
    font-weight: bold;
    color: #e30b17;
}

/* Material page arrow down color*/
.arrow-down{
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #616161;
    display: inline-block;
    margin-right: 10px;
    vertical-align: bottom;
}
ul.level {
    display: flex;
    margin: 10px 0 15px 0 !important;
}
.about ul.level {
    margin: 10px 0 20px -10px !important;
    padding: 0 0 15px 0 !important;
    border-bottom: 5px #dedede solid;
}
ul.level li {
    width: 22px;
    height: 22px;
    font-size: 11px;
    font-weight: bold;
    line-height: 22px;
    text-align: center;
    color: #9d9d9d;
    background: #fff;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    border-left: 1px solid #e6e6e6;
}
ul.level.no_level li {
    background: #f1f1f1;
    color: #cdcdcd;
}
ul.level li:last-child, .about ul.level li:nth-child(11) {
    border-right: 1px solid #e6e6e6;
}
/*.about ul.level li:last-child {
    width: auto;
    padding: 0 0 0 10px !important;
    border: none;
    background: #fff;
    font-weight: normal;
    color: #ababab;
+}*/
ul.level li:first-child {
    width: 55px;
    font-weight: normal;
    letter-spacing: 1px;
}
ul.level.no_level li:first-child {
    background: #f1f1f1;
}
ul.level li.level_on {
    color: #fff;
    background: #727272;
}
ul.level li.level_off {
    background: #e5e5e5;
}

.area-material-entry .overview .arrow-down{border-top-color: #5AA743; }
.area-material-beginner .overview .arrow-down{border-top-color: #7BC3F5; }
.area-material-intermediate .overview .arrow-down{border-top-color: #E3A900; }
.area-material-advanced .overview .arrow-down{border-top-color: #ED5E3D; }
.area-material-business .overview .arrow-down{border-top-color: #A780B7; }
.area-material-travel .overview .arrow-down{border-top-color: #6BB72D; }
.area-material-pronunciation .overview .arrow-down{border-top-color: #F2BE00; }
.area-material-kids .overview .arrow-down{border-top-color: #E2B1CC; }
.area-material-black-jack .overview .arrow-down{border-top-color: #1e559e; }
.area-material-conversation .overview .arrow-down {border-top-color: #E88831;}
.area-material-ielts .overview .arrow-down {border-top-color: #C90025}
/* Material page h3 text color*/
.area-material .overview h3{
    font-size: 23px;
    margin: 10px 0 !important;
}
.area-material-entry .overview h3, .materials-box-entry .material-title h3{color: #5AA743;} /* entry */
.area-material-travel .overview h3, .materials-box-travel .material-title h3{color: #6BB72D;}   /* travel */
.area-material-kids .overview h3, .materials-box-kids .material-title h3{color: #E2B1CC;}   /* kids */
.area-material-business .overview h3, .materials-box-business .material-title h3{color: #A780B7;}   /* business */
.area-material-advanced .overview h3, .materials-box-advanced .material-title h3{color: #ED5E3D;}   /* advanced*/
.area-material-beginner .overview h3, .materials-box-beginner .material-title h3{color: #7BC3F5;}   /* beginner */
.area-material-intermediate .overview h3, .materials-box-intermediate .material-title h3{color: #E3A900;}   /* intermediate */
.area-material-pronunciation .overview h3, .materials-box-pronunciation .material-title h3{color: #F2BE00;} /* pronunciation */
.materials-box-news .material-title h3{color: #E85699;} /* daily news */
.materials-box-news-bgnr .material-title h3{color: #00BFB2;} /* daily news beginner */
.materials-box-speech .material-title h3{color: #7FA0DB;} /* speech */
.area-material-speaking-test .overview h3, .materials-box-speakingtest .material-title h3{color: #7FA0DB;} /* speaking test */
.area-material-black-jack .overview h3, .materials-box-blackjack .material-title h3{color: #1e559e;} /* blackjack */
.area-material-conversation .overview h3, .materials-box-conversation .material-title h3 {color: #E88831;}/* conversation */
.area-material-ielts .overview h3, .materials-box-ielts .material-title h3 {color: #C90025;}

.area-material .overview{
    line-height: 24px;
    margin-bottom: 30px;
    max-height: 100% !important;
}

.area-material .overview img{
    margin-right: 30px;
}
#page.area-material .overview .h1_description {
    font-size: 14px;
    line-height: 20px;
    margin: 0 0 40px 0!important;
}
#page.area-material .overview .levelMap {
    width: 100%;
    background: #EFEFEF;
    padding: 15px 30px;
    box-sizing: border-box;
}

#page.area-material .overview .levelMap p {
    font-size: 16px;
    line-height: 25px;
    color: #333;
}
#page.area-material .overview .levelMap p .detail {
    display: inline-block;
    height: 25px;
    width: 125px;
    font-size: 14px;
    line-height: 26px;
    border-radius: 14px;
    color: #161616;
    padding: 2px;
    background: #FFF;
    float: right;
    text-align: center;
}
#page.area-material .overview .levelMap p .detail small {
    font-size: 10px;
    position: relative;
    top: -1px;
}
#page.area-material .overview .levelMap table {
    width: 100%;
    border-collapse: collapse;
    border-spacing : 0;
    margin-top: 10px!important;
}
#page.area-material .overview .levelMap table thead th {
    font-size: 14px;
    line-height: 14px;
    font-weight: normal;
    text-align: center!important;
    box-sizing: border-box;
    padding-top: 4px;
}
#page.area-material .overview .levelMap table thead th:nth-of-type(1) {
    width: 140px;
    color: #666666;
    background: #E5E5E5;
}
#page.area-material .overview .levelMap table thead th:nth-of-type(2) {
    color: #999999;
    background: #FFF;
    border-bottom: 2px solid #E5E5E5;
}
#page.area-material .overview .levelMap table thead th:nth-of-type(3) {
    color: #02A9FE;
    background: #AEE4FF;
}
#page.area-material .overview .levelMap table thead th:nth-of-type(4) {
    color: #FFF;
    background: #02A9FE;
}
#page.area-material .overview .levelMap table thead th:nth-of-type(5) {
    color: #FFF;
    background: #2B5AD3;
}
#page.area-material .overview .levelMap table tbody td {
    text-align: center!important;
    background: #FFF;
    box-sizing: border-box;
    padding-top: 3px;
}
#page.area-material .overview .levelMap table tbody td:first-of-type {
    font-size: 14px;
    line-height: 20px;
    color: #666666;
}
#page.area-material .overview .levelMap table tbody td ~ td {
    width: 45px;
    font-size: 23px;
    font-weight: bold;
    line-height: 40px;
    border-left: 2px solid #E5E5E5;
    box-sizing: border-box;
}
.obi_wrap {
    width: 100%;
    margin: 20px 0 25px;
    box-sizing: border-box;
    border-bottom: 10px solid #FFF;
}
.obi {
    width: 100%;
    text-align: center;
    border-bottom: 2px solid #2FA8F5;
}
.obi li {
    position: relative;
    width: 205px;
    display: inline-block;
    background: #FFF;
    padding: 2px 2px 4px;
    box-sizing: border-box;
    border-radius: 5px 5px 0 0;
    border-left: 2px solid #E5E5E5;
    border-top: 2px solid #E5E5E5;
    border-right: 2px solid #E5E5E5;
    box-sizing: border-box;
}
.obi li.newBooks::before {
    content: '';
    height: 20px;
    width: 20px;
    border-radius: 10px;
    background: #FF4600;
    position: absolute;
    right: -10px;
    top: -8px;
}
.obi li:hover {
    cursor: pointer;
}
.obi li.on {
    position: relative;
    z-index: 10;
    border-left: 2px solid #2FA8F5;
    border-top: 2px solid #2FA8F5;
    border-right: 2px solid #2FA8F5;
    bottom: -2px;
}
.obi li .description {
    display: inline-block;
    font-size: 12px;
    line-height: 12px;
    color: #666666;
    text-align: center;
    padding: 10px 0 4px;
    border-bottom: 1px solid #E5E5E5;
}
.obi li .title {
    display: block;
    font-size: 16px;
    line-height: 16px;
    color: #333333;
    text-align: center;
    font-weight: bold;
    padding: 7px 0 10px;
}
.obi li.on .description {
    border-bottom: 1px solid #2FA8F5;
}
.obi li.on .title,.obi li.on .description {
    color: #00B1FA;
}
.obi li.on .title .m_count {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: top;
}
.obi li ~ li {
    margin-left: 10px!important;
}
.obi_wrap .list {
    width: 100%;
}
.obiWrap_inside_wrap .obiWrap_inside {
    display: none;
    width: 100%;
    padding: 25px 30px 15px;
    box-sizing: border-box;
    background: #FFF;
}
.obiWrap_inside_wrap .obiWrap_inside:nth-of-type(1) {
    display: block;
}
.obiWrap_inside_wrap .obiWrap_inside .materialList {
    border-collapse: separate!important;
    list-style-position: outside;
    list-style: none;
}

.obiWrap_inside_wrap .obiWrap_inside .materialList li {
    display: inline-block;
    height: 15px;
    font-size: 12px;
    line-height: 15px;
    border-right: 2px solid #EFEFEF;
    padding: 0 20px!important;
    vertical-align: top;
}
.obiWrap_inside_wrap .obiWrap_inside .materialList li:first-of-type {
    padding-left: 0!important;
}
.obiWrap_inside_wrap .obiWrap_inside .materialList li:last-of-type {
    border-right: none;
}
.obiWrap_inside_wrap .obiWrap_inside .materialList li a {
    color: #000;
}
.obiWrap_inside_wrap .obiWrap_inside .materialList li a:hover {
    text-decoration: underline!important;
}
.obiWrap_inside_wrap .obiWrap_inside .materialList li a .tag {
    display: inline-block;
    width: 35px;
    height: 14px;
    font-size: 10px;
    line-height: 15px;
    color: #FFF;
    background: #FF4600;
    text-align: center;
    vertical-align: top;
    margin-left: 5px;
}
.obiWrap_inside_wrap .obiWrap_inside .materialList ~ .materialList {
    margin-top: 15px!important;
}
.obiWrap_inside_wrap .obiWrap_inside .textfield {
    width: 100%;
    font-size: 12px;
    line-height: 18px;
    color: #858585;
    padding: 10px 15px;
    box-sizing: border-box;
    background: #F7F7F7;
    margin-top: 15px!important;
}
.obiWrap_inside_wrap .obiWrap_inside .textfield a {
    color: #858585!important;
    text-decoration: underline!important;
}
/**
    pagetop
**/
#page_top {
    display: none;
    opacity: 0;
    position: fixed;
    bottom: 70px;
    right: 70px;
    z-index: 100;
}
#page_top.display {
    display: block;
}
#page_top.animate {
    opacity: 1;
    transition: 1s;
    -webkit-transition: 1s;
    -ms-transition: 1s;
}
#page_top.close_animate {
    opacity: 0;
    transition: 1s;
    -webkit-transition: 1s;
    -ms-transition: 1s;
}
.materials-wrapper .tab02,.materials-wrapper .tab03 {
    display: none;
}
.area-material .overview .materials-title{
    margin: 30px 0 0 230px!important;
    width: 500px;
}

.area-material-top .overview .materials-title {
    margin-left: 0!important;
    margin-right: 0!important;
}

.area-material .overview .materials-title li.title-head{
    display: block;
    margin-bottom: 20px !important;
}
.area-material .overview .materials-title li{
    line-height: 14px;
    display: inline-block;
}
.area-material .overview .materials-title li a p {
    display: inline-block;
    margin-left: 5px !important;
    padding: 2px 3px 3px 4px !important;
    background: #fc0d1b;
    color: #fff;
    font-size: 10px;
    line-height: 1;
    border-radius: 2px;
}
.area-material .overview .materials-title li a{
    background: #ffffff;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    padding: 7px 10px 7px 16px !important;
    margin: 0 10px 11px 0 !important;
    box-shadow: 2px 2px 0px #e7e7e7;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    transition: opacity 0.2s ease 0s;
}
.area-material .overview .materials-title li a,
.materials-wrapper div[class^="materials-cat-"] a
{
    text-decoration: none !important;
    position: relative;
    display: block;
}
.area-material .overview .materials-title li a:hover,
.materials-wrapper div[class^="materials-cat-"] a:hover{
    color: inherit !important;
}
.area-material .overview .materials-title li a:hover,
.materials-wrapper div[class^="materials-cat-"] a .materials-box:hover{
    opacity: 0.50;
}
.materials-wrapper div[class^="materials-cat-"] a .materials-box img:hover{
    opacity: 1 !important;
}
.area-material .overview .materials-title li span{
    font-size: 11px;
    margin-left: 24px;
}
.area-material.area-material-black-jack .material-source
{
    position: relative;
    display: block;
    margin-bottom: 30px!important;
}
.area-material-black-jack .material-source span
{
    font-size: 15px;
}
.area-material.area-material-black-jack .overview .materials-title
{
    width: auto;
    margin-top: 10px!important;
}
.area-material.area-material-black-jack .overview .materials-title li a
{
    width: 140px;
}
#page.area-material #content .area-original ul li dl dd > p > span {
    margin-left: 5px;
}
/*===================== Materials ====================== */
.area-material-top .overview .arrow-down{
    border-top-color: #00B1EB;
    vertical-align: top;
    margin-top: 3px;
}
.area-material-top .overview .materials-title{
    background: #efefef;
    float: none;
    width: 100%;
    padding: 17px !important;
    box-sizing: border-box;
}
.area-material-top .overview .materials-title li a{
    font-size: 14px;
    margin: 0 10px 14px 0 !important;
    padding: 11px 1px 11px 12px !important;
    box-shadow: 3px 3px 0px #e7e7e7 !important;
    width: 138px;
}
.area-material-top .overview .materials-title li a[href^="#speaking-test"]{
    width: 159px;
}
.area-material-top .overview .materials-title li a[href^="#news-bgnr"]
{
    width: 195px;
}
.area-material-top .overview .materials-title li a[href^="#discussion"]
{
    width: 165px;
}
.area-material-top .overview .materials-title li a[href^="#black-jack"],
.area-material-top .overview .materials-title li a[href^="#sidebyside"],
.area-material-top .overview .materials-title li a[href^="#basicenglishgrammar"],
.area-material-top .overview .materials-title li a[href^="#pbe"],
.area-material-top .overview .materials-title li a[href^="#see"],
.area-material-top .overview .materials-title li a[href^="#vardaman"]{
    width: auto;
    padding-right: 10px!important;
}
.materials-wrapper h2{
    font-size: 31px;
    font-weight: normal;
    margin-bottom: 10px !important;
}
.materials-wrapper .materials-box,
.materials-wrapper .materials-box.materials-box-speakingtest,
.materials-wrapper .materials-box.materials-box-ielts,
.materials-wrapper .materials-box.materials-box-letsgo,
.materials-wrapper .materials-box.materials-box-toeic {
    background: #fff;
    display: block;
    overflow: hidden;
    height: 210px;
    margin-bottom: 30px;
    position: relative;
    border: 1px solid #bdbdbd;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    transition: opacity 0.3s ease 0s;
}
.materials-wrapper .materials-box-sidebyside {
    height: 250px;
}
.materials-wrapper .materials-box-blackjack {
    height: 240px;
}
.materials-wrapper .materials-box-ponpon{
    height: 240px;
}
.changeHeight {
    height: 230px!important;
}
.materials-wrapper .materials-box.materials-box-speakingtest,
.materials-wrapper .materials-box.materials-box-ielts,
.materials-wrapper .materials-box.materials-box-letsgo,
.materials-wrapper .materials-box.materials-box-sidebyside {
    height: 260px;
}
.materials-wrapper .materials-box.materials-box-basicenglishgrammar {
    height: 300px;
}
.materials-wrapper .materials-box.materials-box-eiken,
.materials-wrapper .materials-box.materials-box-toeic {
    height: 360px;
}
.materials-box.materials-box-letsgo .material-box-img img,
.materials-box.materials-box-sidebyside .material-box-img img {
    padding-top: 40px;
}
.materials-box.materials-box-basicenglishgrammar .material-box-img img {
    padding-top: 50px;
}
.materials-box.materials-box-eiken .material-box-img img,
.materials-box.materials-box-toeic .material-box-img img {
    padding-top: 70px;
}
.materials-wrapper .materials-box:last-child{
    margin-bottom: 40px;
}
.materials-box .materials-content{
    padding: 20px;
}
.materials-box .levelSection {
    padding: 0 0 20px 20px;
}
.materials-box .levelSection > * ~ * {
    padding-right: 20px!important;
}
.materials-content p{
    line-height: 20px;
}
.materials-content big{
    color: #00b2ec;
    font-size: 20px;
    float: right;
    margin-top: 22px;
    letter-spacing: 3px;
}
.materials-head .material-title {
    float: left;
    padding-bottom: 5px;
}
.materials-head .material-title h2{
    font-weight: bold;
    margin-bottom: 5px !important;
    float: none!important;
}
.materials-head span{
    color: #fff;
    background: #636363;
    font-size: 14px;
    font-weight: bold;
    padding: 3px 15px;
    border-radius: 20px;
}
.materials-content h3 {
    font-size: 20px;
    color: #807F80;
}
.materials-btm p{
    color: #00B2EC;
    font-size: 20px;
    position: absolute;
    text-align: right;
    bottom: 15px;
    right: 12px;
}
.materials-btm p strong{
    font-size: 30px;
}
.materials-box .materials-content,
.materials-content .materials-head{
    display: block;
    overflow: hidden;
}
.materials-box .materials-content .levelStage {
    margin-bottom: 12px!important;
    float: right;
}
.materials-box .materials-content .levelStage li {
    display: inline-block;
    font-size: 12px;
    height: 25px;
    line-height: 25px;
    letter-spacing: 2px;
    text-align: center;
    float: left;
    box-sizing: border-box;
}
.materials-box .materials-content .levelStage li:first-of-type {
    width: 55px;
    background: #fff;
    color: #7e7e7e;
    border-left: 1px solid #9d9d9d;
    border-right: 1px solid #9d9d9d;
    border-bottom: 1px solid #9d9d9d;
}
.materials-box .materials-content .levelStage li:last-of-type {
    border-right: none!important;
}
.materials-box .materials-content .levelStage li ~ li{
    width: 25px;
    color: #9d9d9d;
    border-right: 1px solid #9d9d9d;
    border-bottom: 1px solid #9d9d9d;
}
.materials-box .materials-content .levelStage li.period{
    color: #FFF;
    background: #727272;
    border-right: 1px solid #FFF;
}
.materials-box .materials-content .levelStage.off li {
    opacity: 0.7;
    border: 1px solid #E5E5E5;
}
.materials-box .materials-content .levelStage.off li:first-of-type {
    color: #BFBFBF;
    background: #e5e5e5;
}
.materials-box .materials-content .levelStage.off li ~ li {
    background: #F1F1F1;
    color: #CDCDCD;
}
.materials-box .materials-content .levelStage > * ~ * {
    padding-right: 20px;
}
.material-level li{
    border: 1px solid #636363;
    border-radius: 27px;
    color: #636363;
    display: inline-block;
    font-size: 15px;
    height: 28px;
    line-height: 27px;
    padding: 11px !important;
    width: 30px;
}
.materials-box-news .materials-btm p{
    /*margin-top: -34px !important;*/
    bottom: 14px;
    position: absolute;
    right: 13px;
    text-align: right;
}
.area-material .new-ribbon
{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/ribbon_new.png') no-repeat;
    display: block;
    position: absolute;
    height: 76px;
    width: 72px;
    top: -3px;
    left: -3px;
    z-index: 2;
}
.material-box-img{
    float: left;
}
.materials-cat-3 .material-box-img,
.materials-cat-4 .material-box-img,
.materials-cat-5 .material-box-img,
.materials-cat-6 .material-box-img{
    background: #DDDDDD;
    height: 100%;
    width: 212px;
    position: relative;
    padding-top: 20px;
    text-align: center;
}
.materials-cat-3 .material-box-img img,
.materials-cat-4 .material-box-img img,
.materials-cat-5 .material-box-img img,
.materials-cat-6 .material-box-img img{
    width: 121px;
    height: 173px;
}
.materials-cat-3 .material-title h2,
.materials-cat-4 .material-title h2,
.materials-cat-5 .material-title h2,
.materials-cat-6 .material-title h2{
    font-size: 20px;
    line-height: 24px !important;
}
.materials-cat-3 .material-title h3,
.materials-cat-4 .material-title h3,
.materials-cat-5 .material-title h3,
.materials-cat-6 .material-title h3{
    font-size: 16px;
}
.materials-cat-3 > p > a
{
    color: #00B2EC!important;
}
.materials-cat-3 > p > a:hover
{
    text-decoration: underline!important;
}
.materials-cat-4 .materials-box{
    height: 320px;
}
.materials-cat-4 .material-box-img{
    padding-top: 40px;
}
.materials-cat-5 .material-box-img{
    padding-top: 50px;
}
.materials-cat-5 .materials-box{
    height: 285px;
}
.materials-cat-5 .materials-box .subtxt {
    color: #999;
}
.materials-box-blackjack .materials-content p
{
    letter-spacing: -.5px;
    line-height: 16px;
}
.materials-box-blackjack .materials-content p small
{
    display: block;
}
.materials-cat-6 .materials-box{
    height: 318px;
}
.materials-cat-6 .material-box-img img{
    padding-top: 65px;
}
#w .trialbrowsing {
    width: 42px;
    height: 42px;
    vertical-align: middle;
    padding-right: 14px;
}
/* ============================ list css ======================= */
.special-checkbox label.active-checkbox{
    background-color: rgb(241, 229, 90);
    color: rgb(49, 49, 49);
    border-color: rgb(239, 187, 29);
}
.area-schedules *{
    line-height: 1.5;
}
.area-schedules .list-capt{
    margin-bottom: 22px;
}
.area-schedules .list-boxseparate .list-lcol{
    float: left;
}

.area-schedules .list-boxseparate .list-rcol {
    float: right;
    margin-top: 2px;
}
.area-schedules .sort {
    padding-bottom: 3px;
}
.area-schedules .list-boxcaptside .list-unit:first-child {
    margin-left: 0;
}
.area-schedules .list-boxcaptside .list-unit {
    float: left;
    margin-left: 12px;
}
.area-schedules  .list-boxcaptside .list-unit .list-ttl {
    line-height: 20px;
    margin: 0 6px 0 0;
}
.area-schedules  .list-boxcaptside .list-unit p {
    line-height: 22px;
}
.area-schedules  .list-boxcaptside .list-ttl {
    float: left;
    margin: 0 10px 0 0;
}
.area-schedules .list-boxpagenation ul {
    float: right;
    list-style: none outside none;
    margin: 2px -4px 1px 0;
    padding: 0;
    text-align: right;
}
.area-schedules .list-boxpagenation ul li span {
    background-color: #F4F4F4;
    border: 1px solid #999999;
    color: #000000;
    display: block;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.5em;
    margin: 0 4px 0 0;
    min-width: 22px;
    padding: 0 4px;
    text-align: center;
    text-decoration: none;
}

.area-schedules .list-boxpagenation li a:link, .area-schedules .list-boxpagenation li a:visited {
    background-color: #FFFFFF;
    border: 1px solid #999999;
    color: #003399;
    display: block;
    font-size: 12px;
    line-height: 1.5em;
    margin: 0 4px 0 0;
    min-width: 22px;
    padding: 0 4px;
    text-align: center;
}
.area-schedules .list-boxcaptside {
    overflow: hidden;
}
.area-schedules .schedules-list .scroll-schedules .viewport ul.time li, .area-schedules .schedules-list .scroll-schedules .viewport ul.teacher li{
    display:none;
}
/*===================== slider =================*/
.banner{
    height: 350px !important;
    width: 100% !important;
}
ul.bjqs{
    width: 100% !important;
}
.banner ul li{
    width: 100% !important;
}
.banner ul li a{
    display: table;
    height: 100%;
    width: 100%;
}
.banner .bjqs-controls li a{
    height: 24px;
    opacity: 0.5;
    top: 46.5% !important;
    width: 24px;
}
.banner .bjqs-controls li a:hover{
    background-position: -26px 0px;
    opacity: 1;
}

.banner .bjqs-controls li.bjqs-prev a{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest/bt_pagerprev.png') no-repeat;
    margin-left: 20px;
}

.banner .bjqs-controls li.bjqs-next a{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest/bt_pagernext.png') no-repeat;
    margin-right: 20px;
}

.area-member .inner-banner,
.area-member .bjqs,
.area-member .bjqs-slide {
    height: 250px !important;
    margin: 0 auto 20px;
    width: 730px !important;
}

.half_bnr {
    overflow: hidden;
    width: 730px;
    margin: 0 auto 15px;
    text-align: left;
}
.half_bnr a {
    display: inline-block!important;
    width: 360px;
}
.half_bnr a:nth-child(2) {
    float: left;
}
.half_bnr a:nth-child(2) {
    float: right;
}

.bjqs-markers{
    display: none;
}
.slide-1 {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/head/plusnative.jpg') no-repeat center center / cover;
}
.slide-2 {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/head/124yen_gt.jpg') no-repeat center center / cover;
}
.slide-3 {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/head/topbanner.jpg') no-repeat center center / cover;
}
.slide-4 {
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/head/kakoku_gt.png') no-repeat center center / cover;
}

/*============= added ==================*/
#bg{
    width: 916px !important;
    margin: auto;
}

#w {
    background: #f7f7f7 !important;
    display: table;
}

.area-corporate,.corporate-services {
    margin: 0!important;
}

#w .main_canvas .this-at {
    font-size: 12px;
    line-height: 16px;
    padding: 10px 0 78px;
    color: #333;
    list-style: none;
}

#mu {
    width: 730px;
    float: right;
    padding: 0 !important;
}

#su{
    float: left;
    padding-top:15px !important;
}

#header{
    background-color: #ffffff !important;
}

.header_bnr {
    text-align: center;
    margin: 20px 0 10px 0;
}

/*============== hover on images opacity ===============*/
/*#page.area-single #content a img, #page #content a img, #w a img, .banner{
  transition: opacity 0.3s ease 0s ;
}
#page.area-single #content a img:hover, #page #content a img:hover, #w a img:hover, .search-wrapper input[type="image"]:hover,
.banner:hover{
    opacity: 0.70;
}*/


/* ===================================================================================== area-static */
#page.area-static #content .overview {
    overflow: hidden;
}
#page.area-static #content .pdf a img,
#page.area-static #content .pdf a span {
    vertical-align: middle;
}
#page.area-static #content .overview > p {
    margin: 0 0 0 230px;
}
#page.area-static #content .overview > p.link {
    margin: 8px 0 -10px 230px;
}

#page.area-static #content .overview > p.link a {
    color: #1CABEE!important;
    text-decoration: underline!important;
}

#page.area-static #content .pdf a span {
    margin: 0 0 0 10px;
}
#page.area-static #content h2 {
    margin: 0 0 12px;
}
#page.area-static #content h2 + p {
    margin: 0 0 12px;
}
#page.area-static #content .voice-material-legend > span {
    position: relative;
    display: inline-block;
    text-align: right;
    font-size: 12px;
    line-height: 16px;
}
#page.area-static #content .voice-material-legend > span:nth-of-type(1) {
    width: 119px;
}
#page.area-static #content .voice-material-legend > span:nth-of-type(2) {
    width: 166px;
    margin-left: 20px;
}
#page.area-static #content .voice-material-legend > span::after {
    content: '';
    width: 25px;
    height: 25px;
    position: absolute;
    left: 0;
    top: -6px;
}
#page.area-static #content .voice-material-legend > span:nth-of-type(1)::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/play_audio01.png) no-repeat;
    background-size: 100% 100%;
}
#page.area-static #content .voice-material-legend > span:nth-of-type(2)::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/dl_audio01.png) no-repeat;
    background-size: 100% 100%;
}
#page.area-static #content div[class^="area-"] {
    margin: 0 0 80px;
}
#page.area-static #content ul li div span {
    display: block;
    font-size: 10px;
    margin: 10px 0 0 0;
}
#page.area-static #content .sect-box .capt01 {
    margin: 0 0 0 -10px;
    padding: 20px 0 0 0;
    font-size: 18px;
    font-weight: bold;
}
#page.area-static #content .sect-box .sect01 {
    overflow: hidden;
    margin: 0 10px 20px;
}
#page.area-static #content .sect-box .sect01 .float-l {
    width: 140px;
}
#page.area-static #content .sect-box .sect01 dl {
    margin: 0 0 0 160px;
}
#page.area-static #content .sect-box .about .sect01 dl dt {
    margin: 0 0 5px;
    font-weight: bold;
    font-size: 14px;
}
#page.area-static #content .sect-box .about .sect01 dl dd {
    margin: 0 0 20px;
}
#page.area-static #content .sect-box .about .sect01 dl dd:last-of-type {
    margin-bottom: 0;
}
#page.area-static #content .sect-box .flow dl.sect01 dt {
    position: relative;
    padding: 6px 6px;
    background: #eee;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.88, #d4d4d4), color-stop(0.00, #fff));
    background: -webkit-linear-gradient(top, #fff 0%, #eee 88%);
    background: -moz-linear-gradient(top, #fff 0%, #eee 88%);
    background: -ms-linear-gradient(top, #fff 0%, #eee 88%);
    background: linear-gradient(to bottom, #fff 0%, #eee 88%);
    border: 1px #bbb solid;
    border-radius: 6px;
    font-size: 16px;
    font-weight: bold;
}
#page.area-static #content .sect-box .flow dl.sect01 dt:hover {
    opacity: 0.7;
    cursor: pointer;
}
#page.area-static #content .sect-box .flow dl.sect01 dt.on {
    border-radius: 6px 6px 0 0;
    margin-bottom: -1px;
}
#page.area-static #content .sect-box .flow dl.sect01 dt:after {
    position: absolute;
    top: 17px;
    right: 12px;
    content: "▼";
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    text-align: center;
    line-height: 23px;
    font-size: 10px;
    color: #fff;

}
#page.area-static #content .sect-box .flow dl.sect01 dt.on:after {
    content: "▲";
    line-height: 23px;
}
#page.area-static #content .sect-box .flow dl.sect01 dt > .ico {
    content: "1";
    display: inline-block;
    border-radius: 6px;
    width: 45px;
    height: 45px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: 6px;
    padding: 3px;
    font-size: 10px;
    text-align: center;
    line-height: 18px;
    color: #fff;
}
#page.area-static #content .sect-box .flow dl.sect01.box-before dt:after,
#page.area-static #content .sect-box .flow dl.sect01.box-before dt > .ico {
    background: #65D5BE;
}
#page.area-static #content .sect-box .flow dl.sect01.box-inside dt:after,
#page.area-static #content .sect-box .flow dl.sect01.box-inside dt > .ico {
    background: #DEAC00;
}
#page.area-static #content .sect-box .flow dl.sect01.box-after dt:after,
#page.area-static #content .sect-box .flow dl.sect01.box-after dt > .ico {
    background: #F58999;
}
#page.area-static #content .sect-box .flow dl.sect01 dt > .ico span {
    display: block;
    font-size: 20px;
}
#page.area-static #content .sect-box .flow dl.sect01 dt > .ttl {
    font-size: 20px;
    display: inline-block;
    position: relative;
    top: -6px;
}
#page.area-static #content .sect-box .flow dl.sect01 dd {
    display: none;
    overflow: hidden;
    border: 1px #BBB solid;
    padding: 20px;
    background: #FFF;
    border-radius: 0 0 6px 6px;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-img {
    float: left;
    margin-right: 12px;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-txt {
    margin: 0 0 0 160px;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-txt ul {
    margin: 20px 0 0 30px;
    border-top: 1px #7f7f7f dotted;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-txt ul li {
    line-height: 1.8;
    padding: 12px 12px 12px 0;
    border-bottom: 1px #7f7f7f dotted;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-txt ul li:first-child {
    list-style: none url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/ico_num_01.png) outside;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-txt ul li:first-child + li {
    list-style: none url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/ico_num_02.png) outside;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-txt ul li:first-child + li + li {
    list-style: none url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/ico_num_03.png) outside;
}
#page.area-static #content .sect-box .flow dl.sect01 dd .box-txt ul li:first-child + li + li + li {
    list-style: none url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/ico_num_04.png) outside;
}

/* ===================================================================================== area-original */
#page.area-static #content .area-original ul {
    margin: 0 0 8px;
    border: 2px #bbb solid;
    background: #fff;
}
#page.area-static #content .area-original ul li {
    overflow: hidden;
    border-top: 2px #bbb solid;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/bg_list_line.gif) repeat-y left top;
}
#page.area-static #content .area-original ul li:first-child {
    border-top: none;
}
#page.area-static #content .area-original ul li div {
    float: left;
    width: 170px;
    line-height: 1.3;
    padding: 20px;
    font-size: 20px;
    word-wrap: break-word;
    overflow-wrap: break-word;
    text-align: center;
}
#page.area-static #content .area-original ul li div p {
    margin: 20px 0 0;
    padding: 10px;
    background: #f3f3f3;
    font-size: 12px;
    text-align: left;
}

#page.area-static #content .area-original ul li#int-mathematics div p.int-mathematics-info {
    margin: 10px 0 0 0;
    padding: 0;
    background: #fff;
    font-size: 12px;
    text-align: left;
    color: #c00;
}

#page.area-static #content .area-original ul li dl {
    margin: 0 0 0 210px;
    border-left: 2px #bbb solid;
    overflow: hidden;
}
#page.area-static #content .area-original ul li dl dt {
    float: left;
    width: 70px;
    padding: 10px;
}
#page.area-static #content .area-original ul li dl p.level-num {
    float: left;
    width: 40px;
    padding: 3px 0 0 0;
    text-align: center;
}
#page.area-static #content .area-original ul li dl p.level-num span {
    display: block;
    font-size: 10px;
}
#page.area-static #content .area-original ul li dl dd {
    padding: 0 0 0 90px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/bg_list_01.gif) repeat-y left top;
}
#page.area-static #content .area-original ul li dl dd::after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}
#page.area-static #content .area-original ul li dl dd.no-link {
    padding: 10px 10px 10px 140px;
}
#page.area-static #content .area-original ul li dl dd > a {
    display: inline-block;
    width: 210px;
    padding: 10px;
    text-decoration: underline;
    float: left;
}
#page.area-static #content .area-original ul li dl dd > a:nth-of-type(2) {
    margin-left: 40px;
}
#page.area-static #content .area-original ul li dl dd > .btns {
    display: inline-block;
    float: right;
    background: none!important;
    vertical-align: top;
    margin: 5px 10px 5px 0;
}
/*#page.area-static #content .area-original ul li dl dd > .btns span:nth-of-type(3) {
    margin-right: -5px;
}
#page.area-static #content .area-original ul li dl dd > .btns span:last-of-type {
    margin-left: 5px;
}*/
#page.area-static #content .area-original ul li dl dd > p > div {
    position: relative!important;
}
#page.area-static #content .area-original ul li dl dd > p > div:nth-of-type(2) {
    margin-left: 2px!important;
}
#page.area-static #content .area-original ul li dl dd > p > div::after {
    content: '';
    width: 22px;
    height: 22px;
    position: absolute;
    left: 0;
    top: 0;
}
#page.area-static #content .area-original ul li dl dd > p > span {
    display: inline-block;
    width: 30px;
    height: 30px;
    vertical-align: top;
    position: relative;
    text-align: center;
    box-sizing: border-box;
}
#page.area-static #content .area-original ul li dl dd > p > span:nth-of-type(1),#page.area-static #content .area-original ul li dl dd > p > span:nth-of-type(2) {
    background: #FFF;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    background-image: none!important;
}
#page.area-static #content .area-original ul li dl dd > p > span:hover {
    cursor: pointer;
    background: rgba(255,255,255,0.5);
}
#page.area-static #content .area-original ul li dl dd > .btns > span:first-of-type:hover {
    opacity: 1;
    background: rgba(255,255,255,0.5);
}
#page.area-static #content .area-original ul li dl dd > p > span:hover img {
    opacity: 0.5;
}
#page.area-static #content .area-original ul li dl dd > .btns > span:nth-of-type(2) div:hover{
    opacity: 1!important;
}
#page.area-static #content .area-original ul li dl dd > p > span div,#page.area-static #content .area-original ul li dl dd > p img{
    position: absolute!important;
    top: 0!important;
    bottom: 0!important;
    right: 0!important;
    left: 0!important;
    margin: auto!important;
}
#page.area-static #content .area-original ul li dl dd > p a {
    display: block;
}
#page.area-static #content .area-original ul li dl dd > p img {
    width: 30px;
    height: 30px;
}
#content .area-original ul li dl dd > p img:nth
#page.area-static #content .area-original ul li dl dd a:hover {
    text-decoration: underline;
}

#page.area-static #content .area-original ul li#kids-lesson01 div {
    padding: 16px;
}
/*=========== voice material ============*/
#page.area-static #content .area-original ul li dl dd.with-voice-materials .voice-material {
    padding: 10px 10px 0 0;
}
#page.area-static #content .area-original ul li dl dd.with-voice-materials .voice-material span {
    background: none !important;
}
#page.area-static #content .area-original ul li dl dd.with-voice-materials .voice-material span a {
    display: inline;
    margin: 0;
    padding: 0;
    text-decoration: none;
}
.voice-material-legend img {
    vertical-align: bottom;
}

/* ===================================================================================== area-web */
#page.area-static #content .area-web ul li {
    margin: 0 0 20px;
}
#page.area-static #content .area-web ul li div {
    padding: 5px 10px;
    border: 2px #bbb solid;
    border-bottom: none;
    background: #fff;
    font-size: 16px;
}
#page.area-static #content .area-web ul li table {
    border: 2px #bbb solid;
    border-collapse: collapse;
    border-spacing: 0;
    background: #fff;
}
#page.area-static #content .area-web ul li table th {
    width: 170px;
    padding: 10px;
    font-weight: normal;
}
#page.area-static #content .area-web ul li table th a {
    display: block;
    padding: 0 0 0 20px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/ico_external.gif) no-repeat left 5px;
}

#page.area-static #content .area-web ul li table td {
    padding: 10px;
}
/* ===================================================================================== area-kids */
#page.area-static #content .area-kids ul {
    border: 2px #bbb solid;
    background: #fff;
}
#page.area-static #content .area-kids ul li {
    overflow: hidden;
    padding: 10px;
    border-top: 2px #bbb solid;
}
#page.area-static #content .area-kids ul li:first-child {
    border-top: none;
}
#page.area-static #content .area-kids ul li p {
    margin: 10px 0 10px 360px;
}
#page.area-static #content .area-kids ul li p img {
    margin: 0 0 20px;
}

/* ===================================================================================== area-talk */
#page.area-static #content .area-talk ul {
    border: 2px #bbb solid;
    background: #fff;
}
#page.area-static #content .area-talk ul li {
    overflow: hidden;
    padding: 20px;
    border-top: 2px #bbb solid;
}
#page.area-static #content .area-talk ul li:first-child {
    border-top: none;
}
#page.area-static #content .area-talk ul li div.talk-l {
    float: left;
    width: 240px;
    padding: 20px 0 0 20px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/bg_talk_l.png) no-repeat left top;
    font-size: 20px;
}
#page.area-static #content .area-talk ul li div.talk-r {
    padding: 0 20px 20px 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/bg_talk_r.png) no-repeat right bottom;
}
#page.area-static #content .area-talk ul li div + p {
    margin: 20px 0 20px 290px;
}


#header .hd-gnav{
  padding-bottom:0px !important;
}

/*========= menu / navigation ==============*/
.head-box {
    display: block;
    position: relative;
}
.head-box .head-top{
    background: #333333;
    color: #ffffff;
}
.head-box .head-top .logo-wrap {
    display: inline-block;
}
.head-box .head-top .tagline{
    display: inline-block;
    font-size: 16px;
    font-weight: normal;
    padding-top: 10px !important;
}
.head-box .head-top .btn-login a {
    border: 1px solid #fff;
    border-radius: 4px;
    color: #fff;
    display: block;
    font-size: 12px;
    margin-top: 6px;
    padding: 4px 14px;
    text-decoration: none;
}

.head-box .head-top .btn-login a:hover {
    background: #fff;
    color: #333;
}
.head-box .menu {
    height: 50px;
    position: relative;
    background: #efefef;
}

.head-box .menu .bg_h1 {
    height: 50px;
    width: 230px;
    background-color: #454545;
    position: absolute;
    z-index: 0;
}

.head-box .menu .bg_h1 h1 {
    width: 100%;
    text-align: center;
    line-height: 50px;
    font-size: 12px;
    font-weight: normal;
    color: #FFF;
}

.head-box .menu .bg_h1 p {
    width: 100%;
    text-align: center;
    line-height: 50px;
    font-size: 12px;
    font-weight: normal;
    color: #FFF;
}

.head-box .container {
    display: table;
    width: 916px;
    margin: auto;
}

.head-box .logo {
    float: left;
    padding: 10px 10px 10px 0;
}

.head-box .menu .bg_nav {
    height: 50px;
    background: rgb(239, 239, 239) none repeat scroll 0% 0%;
    z-index: 9999;
    position: relative;
    margin-left: 28%;
    top: 0;
}

.head-box .nav {
    display: block;
    width: 916px;
    position: absolute;
    top: 0px;
    left: 50%;
    z-index: 100;
    margin-left: -458px !important;
}

.head-box .nav li {
    display: block;
    float: left;
    position: relative;
    width: 152px;
    background: rgb(239, 239, 239) none repeat scroll 0% 0%;
    text-align: center;
}

.head-box .nav > li {
    height: 50px;
}

.head-box .nav li:hover {
    box-sizing: border-box;
    border-bottom: 4px solid #0082ca;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

.head-box .nav > li > a {
    color: #303030;
    border-left: 1px solid #adadad;
    display: block;
    font-size: 15px;
    line-height: 5px;
    padding: 8px 15px;
    position: relative;
    margin-top: 14px;
}

.head-box .nav > li:nth-child(1) > a {
    height: 17px;
    border-left: none;
}

.head-box .nav li a {
    color: inherit;
    text-decoration: none;
}

.head-box .nav > li > a:hover {
    text-decoration: none;
}

.head-box .nav li:last-child a {
    margin-right: 0;
}

.head-box .nav > li:first-child  h1 {
    border-left: 0;
    background-color: #454545;
    color: #FFF;
    height: 100%;
    line-height: 45px;
    padding: 0 20px!important;
    font-weight: normal;
}

.head-box .nav > li:first-child:hover {
    border-bottom: none;
    cursor: auto;
}

.head-box .nav > li:first-child > a:active {
    border: none;
}

/* navigation dropdown */
.head-box .nav .dropdown {
    background: #f1f0f0;
    display: none;
    left: 0;
    min-width: 152px;
    position: absolute;
    top: 100%;
    z-index: 9999;
    height: auto!important;
}

.head-box .nav .dropdown li {
    border-bottom: 1px solid #dedcdc;
    width: 100%;
    height: 30px;
    box-sizing: border-box;
}

.head-box .nav .dropdown li a {
    border-bottom: 0px;
    display: block;;
    font-size: 12px;
    margin: auto;
    line-height: 30px;
    padding: 0px 15px;
    position: relative;
    white-space: nowrap;
}

.head-box .nav .dropdown li a:hover {
    height: 30px;
    border-bottom: 1px solid #dedcdc;
    background: #eae8e8;
}

.head-box .nav > li:first-of-type:hover > a {
    border-bottom: 4px solid #0082ca;
    padding-bottom: 7px;
}

.head-box .nav .dropdown li:last-of-type {
    border-bottom: none;
}

.head-box .nav .nav-active {
    border-bottom: 4px solid #0082CA;
    box-sizing: border-box;
}

/*========= menu / navigation ==============*/

.head-box-biz {
    display: table;
    position: relative;
    width: 100%;
}

.head-box-biz .head-top {
    background: #333333;
    color: #ffffff;
}

.head-box-biz .head-top .logo-wrap {
    display: inline-block;
}

.head-box-biz .head-top .nav02 li a {
    line-height: 18px;
    margin-left: 0;
    color: #333 !important;
    padding: 6px 0;
    margin-top: 5px;
    display: block;
    font-size: 15px;
}

.head-box-biz .head-top .nav02 li:nth-child(1) a {
    width: 176px;
    text-align: center;
}

.head-box-biz .head-top .nav02 li:nth-child(2) a {
    padding-top: 7px;
}

.head-box-biz .head-top .tagline {
    display: inline-block;
    font-size: 16px;
    font-weight: normal;
    padding-top: 10px !important;
}

.head-box-biz .head-top .btn-login a {
    border: 1px solid #fff;
    border-radius: 4px;
    color: #fff;
    display: block;
    font-size: 12px;
    margin-top: 6px;
    padding: 4px 14px;
    text-decoration: none;
}

.head-box-biz .head-top .btn-login a:hover {
    background: #fff;
    color: #333;
}

.head-box-biz .menu {
    height: 50px;
    position: relative;
    background: #FFFFFF;
}
.head-box-biz .menu .bg_h1 {
    height: 50px;
    width: 230px;
    background-color: #454545;
    position: absolute;
    z-index: 0;
}

.head-box-biz .menu .bg_h1 h1 {
    width: 100%;
    text-align: center;
    line-height: 50px;
    font-size: 12px;
    font-weight: normal;
    color: #FFF;
}

.head-box-biz .container {
    display: table;
    width: 916px;
    line-height: 0;
    margin: auto;
}

.head-box-biz .logo {
    float: left;
    padding: 10px 10px 10px 0;
}

.head-box-biz .menu .bg_nav {
    height: 50px;
    background: rgb(239, 239, 239) none repeat scroll 0% 0%;
    width: 78%;
    z-index: 9999;
    position: relative;
    margin-left: 28%;
    top: 0;
}

.head-box-biz .nav {
    display: block;
    width: 916px;
    position: absolute;
    top: 0px;
    left: 50%;
    z-index: 9999;
    margin-left: -458px !important;
}

.head-box-biz .nav li {
    float: left;
    display: block;
    position: relative;
}

.head-box-biz .nav02 li {
    float: left;
    display: block;
    position: relative;
}

.head-box-biz .nav li:hover {
    box-sizing: border-box;
    border-bottom: 4px solid #0082ca;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

.head-box-biz .nav > li > a {
    color: #333333;
    display: block;
    font-size: 15px;
    line-height: 27px;
    padding: 11px 21px;
    position: relative;
}

.head-box-biz .nav li:nth-child(1) a {
    padding-left: 0;
}

.head-box-biz .nav li a {
    color: inherit;
    text-decoration: none;
}

.head-box-biz .nav > li > a:hover {
    text-decoration: none;
}

.head-box-biz .nav li:last-child a {
    margin-right: 0;
}

.head-box-biz .nav > li:first-child  h1 {
    border-left: 0;
    background-color: #454545;
    color: #FFF;
    height: 100%;
    line-height: 45px;
    padding: 0 20px!important;
    font-weight: normal;
}

.head-box-biz .nav > li:first-child > a:active {
    border: none;
}

/* navigation dropdown */

.head-box-biz .nav .dropdown {
    background: #f1f0f0;
    display: none;
    left: 0;
    min-width: 160px;
    position: absolute;
    top: 100%;
    z-index: 9999;
}

.head-box-biz .nav .dropdown li {
    border-bottom: 1px solid #dedcdc;
    width: 100%;
    height: 30px;
}

.head-box-biz .nav .dropdown li a:hover {
    height: 30px;
    background: #eae8e8;
}

.head-box-biz .nav .dropdown li a {
    border-bottom: 0px;
    display: block;
    font-size: 12px;
    line-height: 30px;
    margin: auto;
    padding: 0px 15px;
    position: relative;
    white-space: nowrap;
}

.head-box-biz .nav .nav-active > a {
    border-bottom: 4px solid #0082ca;
    padding-bottom: 7px;
}

.dropdown .nav-active a {
    background: #e8e8e8;
}

.txet_center {
    text-align: center;
}

#page.area-static #content .sect-box .about .sect01 dl dd a.t-blue, .material_list li a {
    color: #1CABEE!important;
    text-decoration: underline!important;
}

/*========= custom ==============*/
.disc li a {
    color: #1CABEE!important;
    text-decoration: underline!important;
}
.indent{
    text-indent:1.0em;
}

/*========= labels ==============*/
.label{
    background: #ff8400;
    color: #ffffff;
    font-size: 15px;
    font-weight: normal;
    letter-spacing: 2px;
    padding: 3px 9px;
}
.label.label-book{
    background: #56beee;
    padding: 3px 12px;
}
.label.label-end{
    background: #474747;
    color: #ffffff;
}
.label.label-stop{
    background: #cdcdcd;
    color: #666666;
}
/*========= announcement ==============*/
#w .announce-feature{
    background: #cc0000;
    color: #fff;
    font-size: 14px;
    padding: 3px 0;
}
#w .announce-feature h3{
    background: #ffffff;
    color: #cc0000;
    line-height: 23px;
    margin-top: 2px;
    padding: 0 11px;
    position: absolute;
}
#w .announce-feature ul{
    float: left;
    margin-left: 74px;
}
#w .announce-feature ul li .arrow-right{
    border-color: transparent transparent transparent #fff;
    border-width: 5px 0 5px 8px;
    border-style: solid;
    display: inline-block;
    margin-right: 8px;
}
#w .announce-feature ul li a{
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    line-height: 27px;
}
#w .announce-feature ul li a:hover{
    text-decoration: none;
}
#w .announce-feature #btn-erase{
    color:#fff;
    float:right;
    font-size: 20px;
    margin-top:-3px;
    background: transparent;
    border: 0;
    cursor: pointer;
    line-height: 20px;
    padding: 0;
    text-decoration: none;

}
/*========= buttons ==============*/

button {
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
    background: none;
    border: none;
}

.btn:hover{
    opacity: 0.70;
}

.btn{
    background: #eaeaea;
    color: #fff !important;
    display: inline-block;
    font-size: 0.72rem;
    font-weight: bold;
    line-height: 21px;
    padding: 2px 7px 1px;
    position: relative;
    text-decoration: none !important;
}
.btn-primary {
    /*background: linear-gradient(to bottom, #feae13 1%,#fe990f 100%);
    background: -moz-linear-gradient(top, #feae13 1%, #fe990f 100%);
    background: -webkit-linear-gradient(top, #feae13 1%,#fe990f 100%);*/

    background: #feae13;
    border: 1px solid #ffa400;
    /*box-shadow: 0 1px 0 #fed071 inset;*/
    /*text-shadow: 1px 1px 1px #fd8308;*/

    border-radius: 2px;
}
#page.area-flow #content div.area-questionnaire .bx-bt .btn-churn {
    font-size: 18px;
    letter-spacing: 2px;
    margin-left: 40px;
    padding: 8px 12px;
}
.btn-primary-2 {
    background: #444444;
    background: -moz-linear-gradient(top, #444444 0%, #040203 100%);
    background: -webkit-linear-gradient(top, #444444 0%, #040203 100%);
    background: linear-gradient(to bottom, #444444 0%, #040203 100%);
    border: 0;
}
.btn-primary-2 img {
    padding-right: 12px;
    vertical-align: middle;
}
#page.area-flow #content div.area-questionnaire .bx-bt .btn-surrender {
    font-size: 18px;
    letter-spacing: 3px;
}
.btn-secondary-2 {
    background: #ff9000;
    background: -moz-linear-gradient(top, #ffa900 0%, #ff7c00 100%);
    background: -webkit-linear-gradient(top, #ffa900 0%, #ff7c00 100%);
    background: linear-gradient(to bottom, #ffa900 0%, #ff7c00 100%);
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border: 2px solid #ffc800;
    text-shadow: 1px 1px 0px #ff6d00;
    padding: 7px 12px;
}
.btn-secondary-2 img {
    padding-right: 10px;
    vertical-align: baseline;
}
.btn-emp-details{
    background: #00bfb2;
    border: 1px solid #00b2a4;
    border-radius: 3px;
    font-size: 39px;
    font-weight: normal;
    padding: 50px 0;
    text-align: center;
    width: 100%;
}
.btn-contact-req{
    background: #F3D13B;
    color: #333 !important;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-bottom: 4px solid #B29900;
    font-weight: normal;
    display: block;
    font-size: 26px;
    letter-spacing: 3px;
    padding: 12px 0;
    text-decoration: none !important;
}
.btn-contact-req img{
    margin-right: 45px;
    vertical-align: middle;
}
#page .btn-contact-req:hover{
    color: initial;
}
.btn-contact{
    background: #F3D13B;
}
.head-box .nav li .btn-contact:hover{
    background: #ffe46e;
    border-bottom: 0;
}

.head-box-biz .nav li .btn-contact:hover {
    background: #ffe46e;
    border-bottom: 0;
}

.btn-tertiary{
    background: #FF7800;
    border-bottom: 7px solid #EE6400;
    box-sizing: border-box;
    letter-spacing: 2px;
    font-size: 41px;
    height: 87px;
    line-height: 67px;
    padding: 9px 0;
    text-align: center;
    width: 100%;
}

.btn-tertiary img{
    position: absolute;
    right: 30px;
    top: 26px;
}
/*========= footer banner ==============*/
.footer-banner{
    border-top: 1px solid #ccc;
    margin-top: 40px;
    width: 100%;
}
.footer-banner ul li {
    float: left;
    margin-left: 0 !important;
    margin-right: 15px !important;
}
.footer-banner ul li:last-child{
    margin-right: 0 !important;
}
.footer-banner ul li a img{
    margin-top: 40px;
}

/*========= tv commercial ==============*/
#area-commercial h2{
    color: #525252;
    font-size: 26px;
}
.commercial-desc{
    margin-top: 30px;
}
.commercial-content{
    font-size: 14px;
    margin-bottom: 15px;
}
.commercial-content iframe{
    border: 0;
}
.commercial-content div{
    margin-top: 40px;
}

#download-audio, #download-audio-travel, #download-audio-cool{
    display:none;
    margin-top:10px;
}

.area-profile h2{
    font-weight: normal;
    margin: 60px 0 30px !important;
}
.area-profile .desc-box{
    background: none repeat scroll 0 0 #ffffff;
    border-radius: 10px;
    font-size: 14px;
    margin-bottom: 30px;
    overflow: hidden;
    padding: 25px;
}
.area-profile .desc-box figure{
    float: left;
    margin: 0 37px 0 0;
}
.area-profile .desc-box h3{
    font-size: 21px;
    font-weight: normal;
    margin-bottom: 10px !important;
}
.area-profile .desc-box h3 span{
    font-size: 14px;
    margin-left: 15px;
}
.area-profile .desc-box .desc-info{
    margin-top: 5px;
}
.area-profile .desc-box .desc-info p{
    letter-spacing: 1px;
    line-height: 20px;
    white-space: pre-line;
}
.area-profile .desc-box .desc-info ul li{
    font-size: 13px;
    letter-spacing: 1px;
    line-height: 20px;
}

/*======= monitor =========*/
#area-monitor .bnr-monitor img{
    margin: 50px 0 20px;
}

#area-monitor p,
#area-monitor-detail p{
    font-size: 14px;
}

#area-monitor h2,
#area-monitor-detail h2{
    font-size: 21px;
    font-weight: normal;
    letter-spacing: 3px;
}
#area-monitor .monitor-label,
#area-monitor-detail .monitor-label{
    background: #f7ce02;
    border-radius: 3px;
    color: #433534;
    margin: 30px auto 20px;
    padding: 4px 10px;
    text-align: center;
    text-transform: uppercase;
    width: 80px;
}
#area-monitor-detail .sect-monitor-report .monitor-label{
    margin-top: 10px;
    width: 155px;
}
#area-monitor-detail .sect-monitor-before .monitor-label{
    background: #cccccc;
    margin-top: 0;
    padding: 4px 18px;
    width: 51px;
}
#area-monitor-detail .sect-monitor-after .monitor-label{
    padding: 4px 20px;
    width: 39px;
}
#area-monitor .sect-monitor-list ul li{
    display: inline-block;
    position: relative;
    margin: 0 19px 30px 0;
    width: 23.1%;
}
#area-monitor .sect-monitor-list ul li:nth-child(4n){
    margin-right: 0;
}
#area-monitor .sect-monitor-list ul li a{
    text-decoration: none;
}
#area-monitor .sect-monitor-list ul li figure{
    margin: 0;
}

#area-monitor .sect-monitor-list ul li figure img{
    display: block;
}

#area-monitor .sect-monitor-list .monitor-list-info{
    background: #ffffff;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    padding: 13px 0;
    text-align: center;
}

#area-monitor .sect-monitor-list .monitor-list-info h3{
    margin-bottom: 7px;
}

#area-monitor .sect-monitor-list .monitor-list-info small{
    font-size: 11px;
}
/*======= monitor detail page =========*/
#area-monitor-detail .sect-monitor-report{
    display: table;
    margin-top: 50px;
}
#area-monitor-detail .sect-monitor-report ul li{
    float: left;
    margin-right: 18px;
}
#area-monitor-detail .sect-monitor-report ul li:last-child{
    margin-right: 0;
}

#area-monitor-detail .sect-monitor-score,
#area-monitor-detail .sect-monitor-before{
    display: table;
    margin: 30px 0;
    position: relative;
    width: 100%;
}
#area-monitor-detail .sect-monitor-score .monitor-score-inner,
#area-monitor-detail .sect-monitor-before .monitor-before-inner,
#area-monitor-detail .sect-monitor-after .monitor-after-inner{
    background: #ffffff;
    border-radius: 15px;
    overflow: hidden;
    padding: 32px 28px;
}
#area-monitor-detail .monitor-score-inner > img{
    margin-right: 45px;
}
#area-monitor-detail .monitor-score-desc{
    float: left;
}
#area-monitor-detail .monitor-score-head{
    display: block;
    font-size: 17px;
    letter-spacing: 2px;
    margin-bottom: 40px;
    position: relative;
}
#area-monitor-detail .monitor-score-head h1{
    font-size: 30px;
    font-weight: normal;
    line-height: 36px;
}

#area-monitor-detail .monitor-score-head img.score_ribbon{
    position: absolute;
    right: -103px;
    top: -20px;
}

#area-monitor-detail .monitor-score-btm{
    border-bottom: 2px dotted #f7ce00;
    font-size: 15px;
    line-height: 50px;
    text-transform: uppercase;
}

#area-monitor-detail .monitor-score-btm span{
    font-size: 40px;
    margin-left: 18px;
    vertical-align: middle;
}

#area-monitor-detail .monitor-score-btm span img{
    margin: 0 15px;
}

#area-monitor-detail .monitor-score-btm span strong{
    color: #ff7800;
    font-size: 64px;
}

#area-monitor-detail .sect-monitor-before .monitor-before-inner h3,
#area-monitor-detail .sect-monitor-after .monitor-after-inner h3{
    font-size: 18px;
    font-weight: normal;
    border-bottom: 1px dashed #f7ce00;
    margin-bottom: 15px;
    padding-bottom: 10px;
}

#area-monitor-detail .sect-monitor-before .monitor-before-inner p,
#area-monitor-detail .sect-monitor-after .monitor-after-inner p{
    line-height: 21px;
    margin-bottom: 10px;
}

#area-monitor-detail .sect-monitor-before .monitor-before-inner label{
    vertical-align: bottom;
    margin-right: 20px;
}

#area-monitor-detail ul.checkbox-list li{
    display: inline-block;
    margin-right: 10px;
}
#area-monitor-detail ul.checkbox-list li img{
    margin-right: 5px;
    vertical-align: bottom;
}

/*======= recruitment page =========*/
.area-recruitment{
    letter-spacing: 1px;
}

.area-recruitment .banner{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/recruitment/bnr_recruitment.png') no-repeat center center;
    background-size: cover;
    height: 379px;
    margin-bottom: 50px;
    opacity: 1;
}

.area-recruitment p{
    font-size: 15px;
}

.area-recruitment h2,
.area-recruitment h3{
    color: #00a2d9;
    font-weight: normal;
}

.area-recruitment h2{
    font-size: 26px;
}

.area-recruitment h2.main-title{
    font-size: 31px;
}

.area-recruitment h3{
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 0;
}
.area-recruitment .sect-box{
    background: #ffffff;
    margin: 25px 0;
    padding: 30px;
}

.area-recruitment .sect-box-02{
    line-height: 2;
}

.area-recruitment .area-work{
    display: block;
    height: 270px;
    overflow: hidden;
    margin: 30px 0;
}

.area-recruitment .area-work .bg-whi{
    padding: 53px 32px;
    width: 372px;
}

.area-recruitment .area-work small{
    font-size: 12px;
}

.area-recruitment .area-look{
    margin-bottom: 70px;
}

.area-recruitment .area-look h2{
    margin-top: 30px !important;
}

.area-recruitment .area-look h3{
    color: #333;
    margin-top: 20px !important;
}

.area-recruitment .area-jobs .nonjobs-box {
    background: #ffffff;
    overflow: hidden;
    padding: 25px 20px;
    text-align: center;
    font-size: 15px;
}

.area-recruitment .area-jobs h2{
    font-size: 32px;
    font-weight: bold;
}

.area-recruitment .area-jobs h2 span{
    font-size: 21px;
}

.area-recruitment ul.location-list.location-list li{
    background: #00a2db;
    padding: 10px 0 !important;
    position: relative;
    text-align: center;
    width: 100%;
}

.area-recruitment ul.location-list li a{
    text-decoration: none !important;
    transition: 0.3s ease 0s;
}

.area-recruitment ul.location-list li a:hover{
    opacity: 0.7;
}

.area-recruitment ul.location-list li h2{
    color: #ffffff;
}

.area-recruitment ul.location-list li img{
    left: 17px;
    position: absolute;
    top: -11px;
}

.area-recruitment ul.location-list li:nth-child(2) img{
    left: 68px;
}

.area-recruitment ul.location-list li:first-child:after,
.area-recruitment ul.location-list li:first-child:before,
.area-recruitment ul.location-list li:nth-child(2):after,
.area-recruitment ul.location-list li:nth-child(2):before{
    border: solid transparent;
    content: " ";
    left: 50%;
    height: 0;
    position: absolute;
    pointer-events: none;
    top: 100%;
    width: 0;
}

.area-recruitment ul.location-list li:first-child:after{
    border-top-color: #00a2db;
    border-width: 16px;
    margin-left: -30px;
}

.area-recruitment ul.location-list li:nth-child(2){
    background: #f44142;
}

.area-recruitment ul.location-list li:nth-child(2):after{
    border-top-color: #f44142;
    border-width: 16px;
    margin-left: -30px;
}

.area-recruitment .area-jobs h2.ttl-location{
    clear: both;
    display: inline-block;
    margin: 60px 0 50px !important;
    text-align: center;
    width: 100%;
}

.area-recruitment .area-jobs h2#work-japan{
    color: #222222;
}

.area-recruitment .area-jobs h2.ttl-location img{
    vertical-align: middle;
}

.area-recruitment .area-jobs li:first-child .jobs-box{
    margin: 0;
}

.area-recruitment .area-jobs .jobs-box{
    background: #ffffff;
    overflow: hidden;
    margin-top: 50px;
    padding: 25px 20px;
}

.area-recruitment .area-jobs .jobs-box figure{
    float: left;
    margin: 0 20px 0 0;
}

.area-recruitment .area-jobs .jobs-box .jobs-info{
    float: left;
    width: 65%;
}

.area-recruitment .area-jobs .jobs-box .jobs-info h2{
    color: #333;
    font-size: 21px;
    font-weight: normal;
    margin-bottom: 11px !important;
}

.area-recruitment .area-jobs .jobs-box .jobs-info h2 span{
    font-size: 12px;
    color: #00a2d9;
    margin-left: 10px;
}

.area-recruitment .area-jobs .jobs-box .jobs-info h3{
    color: #333;
    font-size: 16px;
}

.area-recruitment .area-jobs .jobs-box .jobs-info p{
    font-size: 14px;
    letter-spacing: 0;
    margin-top: 10px !important;
}

.area-recruitment .area-jobs .jobs-box .jobs-info p strong{
    color: #00a2d9;
    display: block;
    font-weight: normal;
}

.area-recruitment .area-jobs .jobs-box .btn-more{
    background: #00a0e1;
    font-size: 15px;
    margin-top: 25px;
    padding: 10px 40px;
}

.area-recruitment .area-jobs .jobs-box .btn-more .arrow-right{
    border-color: transparent transparent transparent #ffffff;
    border-width: 5px 0 5px 8px;
    display: block;
    float: left;
    margin: 5px 15px 0 0;
}

.area-recruitment .area-jobs .list-japan .jobs-box .jobs-info h2 span,
.area-recruitment .area-jobs .list-japan .jobs-box .jobs-info p strong{
    color: #e20001;
}

.area-recruitment .area-jobs .list-japan .jobs-box .btn-more{
    background: #e20001;
}

.area-recruitment .go-top{
    float: right;
    margin-top: 20px;
}

.btn-trial {
    background: #FF7800;
    border-bottom: 7px solid #EE6400;
    box-sizing: border-box;
    letter-spacing: 2px;
    font-size: 36px;
    height: 87px;
    line-height: 67px;
    padding: 9px 0;
    text-align: center;
    width: 100%;
    color: #fff !important;
}

.btn-trial-wrap p {
    text-align: center;
    color: #ff7400;
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 4px;
}

.btn-trial-wrap p span {
    font-size: 28px;
}

.btn-coverage, .btn-coverage-top{
    background: #3c96d8;
    border-bottom: 7px solid #2071c4;
    font-size: 26px;
    height: 82px;
    line-height: 58px;
    padding: 9px 0 0 36px;
    text-align: left;
}

.btn-coverage-top {
    text-align: center;
}


.btn-coverage img{
    position: absolute;
    right: 28px;
    top: 22px;
}

.btn-trial .btn-trial-img{
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/pic_greta.png') no-repeat;
    background-size: 100% 100%;
    height: 115px;
    position: absolute;
    top: -35px;
    width: 131px;
}

.btn-trial img{
    position: absolute;
    right: 30px;
    top: 26px;
}

/* =============== area satisfaction guest top*/

#page.area-select-course #content .btn-trial-wrap{
     margin-top: 60px;
 }

#page.area-single #area-guesttop #content .area-satisfaction{
    margin-top: 0 !important;
}

#page.area-single #area-guesttop #content .area-satisfaction h2{
    color: #db9f24;
}

#page.area-single #area-guesttop #content .area-satisfaction h3{
    color: #484848;
}

#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul{
    display: inline-block;
    overflow: visible;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li{
    display: inline-block;
    float: none;
    margin-left: 22px;
    text-align: center;
    width: 207px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li > p{
    background: none repeat scroll 0 0 #b3771a;
    border-radius: 10px;
    color: #fff;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li:first-child{
    margin-left: 6px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li figure{
    display: block;
    margin: 0;
    position: relative;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li figure:before{
    content: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest_g/pic_place_before.png');
    left: -6px;
    position: absolute;
    top: -6px;
}
#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li figure:after{
    content: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest_g/pic_place_after.png');
    right: -6px;
    position: absolute;
    top: -6px;
}

#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li figure p{
    font-size: 15px;
    font-weight: bold;
    margin-top: 4px;
    margin-bottom: 10px;
}

#page.area-single #area-guesttop #content .area-satisfaction .area-satisfaction-inner ul li:last-child figure p{
    font-size: 13px;
    line-height: 15px;
    margin-bottom: 5px;
    margin-top: -1px;
}

/* ============================ register, confirm and complete*/
#w #main-pay.page-customer-info #content,
#w #main-pay.page-confirm #content,
#w #main-pay.page-complete #content
{
    font-size: 14px;
    margin: 0 auto;
    max-width: 1060px;
    min-width: 800px;
    padding: 14px 14px 42px;
    width: 1060px;
}
/* ============================ register user confirm*/

#w .page-regist h2{
    color: #70d1f3;
    font-size: 28px;
    font-weight: bold;
}

#w .page-regist .main-pay-inner{
    background: #E2F6FD;
    display: inline-block;
    padding: 20px;
}
#w .page-regist .main-pay-inner h3{
    color: #70D1F3;
    font-size: 24px;
    font-weight: bold;
}

#w .page-regist .main-pay-inner ul li{
    background: #ffffff;
    box-shadow: 0 2px 0 0 #d2d4d5;
    border-radius: 4px;
    display: block;
    float: left;
    font-size: 14px;
    height: 148px;
    margin-right: 8px;
    margin-bottom: 15px;
    position: relative;
    width: 151px;
}

#w .page-regist .main-pay-inner ul li:nth-child(4n){
    margin-right: 0;
}
#w .page-regist .main-pay-inner ul li a{
    text-decoration: none;
}
#w .page-regist .main-pay-inner ul li div{
    padding-top: 20px;
}
#w .page-regist .main-pay-inner ul li div p{
    line-height: 17px;
}
#w .page-regist .main-pay-inner ul li div img{
    padding-bottom: 10px;
}

/*======= certificate page =========*/

#page.area-certificate #content button:focus,
#page.area-certificate #content select:focus,
#page.area-certificate #content input:focus {
    outline: 0;
}

#page.area-certificate #content {
    overflow: hidden;
}

#page.area-certificate #content .alert {
    display: block;
    margin: 0 0 20px;
    background-color: #fef9f9;
    padding: 10px 0;
    color: #f56c5d!important;
}

#page.area-certificate #content .cert-box {
    background: #fff;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    overflow: hidden;
    padding: 22px 24px;
}
#page.area-certificate #content .cert-box .pop-date
{
    display: block;
    background-color: #f7f7f7;
    padding: 10px;
    border: solid 1px #f2f2f2;
    margin: 0 0 20px 0;
    border-radius: 4px;
    color: #c00;
}
#page.area-certificate #content .cert-box label {
    display: block;
    margin-bottom: 8px;
}

#page.area-certificate #content .cert-box .select-group {
    display: inline-block;
    margin-right: 6px;
    position: relative;
}

#page.area-certificate #content .cert-box .select-group:after {
    content: "";
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #a4a4a4;
    position: absolute;
    right: 9px;
    top: 16px;
}

#page.area-certificate #content .cert-box .select-group select {
    background: #fff;
    border: 1px solid #d3d3d3;
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    height: 37px;
    padding-left: 15px;
    width: 94px;
}

#page.area-certificate #content .cert-box .input-group input {
    background: #fff;
    border: 1px solid #d3d3d3;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-sizing: border-box;
    height: 37px;
    margin: 0;
    padding: 0 16px;
    width: 303px;
}
#page.area-certificate #content .cert-box .select-group:nth-child(4) {
    margin: 0 0 0 1px!important ;
}
#page.area-certificate #content .cert-box .form-group {
    width: 304px;
}
#page.area-certificate #content .cert-box form dl dt,#page.area-certificate #content .cert-box form dl dd {
    display: inline-block;
    position: relative;
}
#page.area-certificate #content .cert-box form dl dt {
    width: 60px;
    text-align: right;
    margin-right: 13px;
}
#page.area-certificate #content .cert-box form dl:last-of-type dd input {
    position: absolute;
    top: 11px;
    left: 10px;
    z-index: 1000;
    opacity: 0;
}
#page.area-certificate #content .cert-box form dl:last-of-type dd input:last-of-type {
    left: 144px;
}
#page.area-certificate #content .cert-box form dl dd label {
    position: relative;
    cursor: pointer;
    margin-left: 20px;
    padding: 10px 20px;
    border-radius: 2px;
    color: #3e4956;
    font-size: 14px;
    text-align: center;
    line-height: 1;
}
#page.area-certificate #content .cert-box form dl dd label:hover {
    cursor: auto;
}
#page.area-certificate #content .cert-box form dl dd label:before {
    position: absolute;
    content: "";
    top: 50%;
    left: -10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    border: 1px solid #cccccc;
    border-radius: 50%;
}
#page.area-certificate #content .cert-box form dl dd input[type="radio"]:checked + label:after {
    position: absolute;
    content: "";
    top: 52%;
    left: -3px;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-radius: 50%;
    background: #56beee;
}

#page.area-certificate #content .cert-box form dl dd label {
    display: inline-block;
}
#page.area-certificate #content .cert-box form dl dd div {
    display: inline-block;
}
#page.area-certificate #content .cert-box form dl dd div + span {
    margin-right: 10px;
}
#page.area-certificate #content .cert-box form dl dd div select {
    width: 85px;
    height: 35px;
    margin-right: 10px;
    padding-left: 10px;
    border: 1px solid #d3d3d3;
    height: 37px;
    background: #FFFFFF;
    box-sizing: border-box;
}
#page.area-certificate #content .cert-box form dl:nth-child(3) dd input {
     width: 604px;
    margin: 20px 0px;
    height: 35px;
    padding-left: 10px;
    box-sizing: border-box;
}
#page.area-certificate #content .cert-box form dl dd .end_date select:last-of-type {
    margin-right: 0;
}

#page.area-certificate #content .btn {
    background: #56beee;
    border: 0;
    border-radius: 25px;
    font-size: 12px;
    font-weight: normal;
    padding: 10px 50px;
    display: block;
    margin: 0 auto;
}
#page.area-certificate #content .btn .arrow-right {
    border-color: transparent transparent transparent #fff;
    border-width: 5px 0 5px 8px;
    display: inline-block;
    margin-right: 7px;
}
#page.area-certificate #content .content-cert {
    padding: 43px 54px;
}
#page.area-certificate #content .content-cert .cert-head > h3 {
    font-weight: normal;
}
#page.area-certificate #content .content-cert .cert-head > img {
    width: 120px;
}
#page.area-certificate #content .content-cert .date {
    letter-spacing: 1px;
}
#page.area-certificate #content .content-cert .date li {
    float: left;
    margin-right: 18px;
}
#page.area-certificate #content .content-cert .date li:last-child {
    margin: 0;
}
#page.area-certificate #content .content-cert.fill .date li {
    margin: 0;
}
#page.area-certificate #content .content-cert h1 {
    display: inline-block;
    font-size: 31px;
    margin-bottom: 30px;
    width: 100%;
}
#page.area-certificate #content .content-cert h2 {
    font-size: 31px;
    margin-bottom: 36px;
    width: 100%;
}
#page.area-certificate #content .content-cert {
    font-size: 14px;
}
#page.area-certificate #content .content-cert.fill .cert-ttl {
    text-align: center;
}
#page.area-certificate #content .content-cert.fill h2 {
    display: inline-block;
    text-align: center;
    width: auto;
}
#page.area-certificate #content .content-cert h3 {
    color: #5d5d5d;
    border-bottom: 2px solid #b9b9b9;
    display: block;
    font-size: 24px;
    margin: auto;
    padding-bottom: 5px;
    text-align: right;
    width: 200px;
}
#page.area-certificate #content .cert-body {
    background: #fafafa;
    margin: auto;
    padding: 20px 30px;
    width: 475px;
}
#page.area-certificate #content .cert-body dl {
    border-bottom: 1px solid #d3d3d3;
    margin: auto;
    overflow: hidden;
    padding: 15px 0 3px;
}
#page.area-certificate #content .cert-body dl:first-of-type {
    padding-top: 0;
}
#page.area-certificate #content .cert-body dl dt {
    float: left;
}
#page.area-certificate #content .cert-body dl dd {
    float: right;
    text-align: left;
    width: 285px;
}
#page.area-certificate #content small {
    color: #5d5d5d;
    display: block;
    margin-top: 20px;
    width: 100%;
}
#page.area-certificate #content .btn.w300 {
    width: 300px;
}
#page.area-certificate #content .btn.btn-save-pdf {
    background: #fff;
    border: 0;
    border-radius: 25px;
    color: #5d5d5d !important;
    font-weight: normal;
    margin-top: 25px;
    padding: 13px 26px;
}
#page.area-certificate #content .btn.btn-save-pdf.disabled {
    background-color: #eaeaea;
    color: #8c8c8c;
    cursor: default;
}
#page.area-certificate #content .btn.btn-save-pdf.disabled:hover {
    opacity: 1;
}
#page.area-certificate #content .btn.btn-save-pdf.disabled .arrow-right {
    border-color: transparent transparent transparent #999999;
}
#page.area-certificate #content .btn.btn-save-pdf .arrow-right {
    display: inline-block;
    margin-right: 5px;
}
#page.area-certificate #content.certification h1 {
    margin-bottom: 20px;
}
#page.area-certificate #content.certification h1 + p {
    margin-bottom: 5px;
}
#page.area-certificate #content .cert-box {
    margin-top: 30px;
}

/*=========================== corporate campaign*/
#w .corporate-campaign .campaign-banner {
    line-height: 0;
    margin-top: 40px;
}
#w .corporate-campaign .banner-caption{
    background: #1eaafa;
    padding: 17px 10px;
}
#w .corporate-campaign .banner-caption h1{
    font-size: 16px;
    font-weight: normal;
    color: #ffffff;
}
#w .corporate-campaign .campaign-content{
    background: #ffffff;
    border: 1px solid #bababa;
    color: #525252;
    font-size: 14px;
    margin: 30px 0 20px;
    padding: 25px 20px;
}
#w .corporate-campaign .campaign-content h2{
    background: #e5e5e5;
    border: 1px solid #d4d4d4;
    color: #555555;
    font-size: 21px;
    font-weight: bold;
    padding: 13px !important;
}
#w .corporate-campaign .campaign-content h3{
    color: #1eaafa;
    border-left: 4px solid #1eaafa;
    font-size: 14px;
    margin-top: 13px !important;
    padding-left: 10px !important;
}
#w .corporate-campaign .campaign-content p{
    padding-top: 10px !important;
}
#w .corporate-campaign .campaign-content a{
    color: #007abe;
    padding-top: 10px;
}
#w .corporate-campaign .campaign-content ul li{
    list-style: disc;
    line-height: 26px;
}
#w .corporate-campaign ul.qualification-list{
    margin-left: 25px !important;
}
#w .corporate-campaign ul.campaign-list{
    margin: 13px 0 0 20px !important;
}
#w .corporate-campaign .campaign-end{
    background: #fff1ba;
    border: 1px solid #ebd88c;
    color: #97822e;
    display: block;
    margin: 6px 0;
    padding: 5px 13px !important;
}
#w .corporate-campaign .fb-like-box {
    margin-top: 30px;
}
#w .corporate-campaign .btn-trial-wrap p {
    font-size: 22px;
    margin-bottom: 4px;
}

/*========================== area-redirect-engoo ========================*/

#page.area-redirect-engoo .area-attention
{
    display: block;
    background: #FFFFFF;
    text-align: center;
    position: relative;
    font-size: 18px;
}
#page.area-redirect-engoo .area-attention img
{
    float: left;
    height: 26px;
    width: 26px;
    padding-bottom: 20px;
    position: relative;
    top: -4px;
    margin-right: 5px;
}
#page.area-redirect-engoo .area-attention .attention-inner
{
    display: inline-block;
    width: 730px;
    text-align: left;
    line-height: 26px;
    padding: 30px 0;
}
#page.area-redirect-engoo .area-attention .attention-inner a
{
    text-decoration: underline;
}
#page.area-redirect-engoo .area-attention .attention-inner small
{
    font-size: 12px;
}
#page.area-redirect-engoo .area-redirect
{
    display: block;
    text-align: center;
    background: #FFFFFF;
    margin-top: 40px!important;
    padding: 50px 25px 40px;
    border-radius: 10px;
    font-size: 22px;
}
#page.area-redirect-engoo .area-redirect .area-redirect-inner
{
    margin: 0!important;
}
#page.area-redirect-engoo .area-redirect .area-redirect-inner p > a > img
{
    height: 20px;
    vertical-align: middle;
    position: relative;
}
#page.area-redirect-engoo .area-redirect img.skype-img
{
    width: 100%;
    display: block;
    margin: 20px 0;
}
#page.area-redirect-engoo .area-redirect .to-engoo
{
    display: block;
}
#page.area-redirect-engoo .area-redirect .to-engoo a
{
    display: inline-block;
    background: #fd7822;
    padding: 8px 60px;
    color: #FFFFFF;
    border-radius: 4px;
    letter-spacing: 2px;
    font-size: 21px;
}
#page.area-redirect-engoo .arrow-right {
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 8px solid #FFFFFF;
    display: inline-block;
    margin-right: 20px;
    vertical-align: middle;
}
#page.area-redirect-engoo .area-redirect .to-eikaiwa
{
    display: block;
    margin-top: 8px;
}
#page.area-redirect-engoo .area-redirect .to-eikaiwa a
{
    display: inline-block;
    letter-spacing: 0;
    text-decoration: underline;
    font-size: 12px;
}

#page.area-redirect-engoo a:hover
{
    color: #fd7822;
}
#page.area-redirect-engoo .area-redirect .to-engoo a:hover,
#page.area-redirect-engoo a:hover img
{
    opacity: .7;
}

#page.area-certificate #content .btn.btn-save-pdf.disabled
{
    background-color: #eaeaea;
    color: #8c8c8c;
    cursor: default;
}
#page.area-certificate #content .btn.btn-save-pdf.disabled:hover
{
    opacity: 1;
}
#page.area-certificate #content .btn.btn-save-pdf.disabled .arrow-right
{
    border-color: transparent transparent transparent #999999;
}
.lesson-list .bt-lessonnote, .lesson-list .bt-rating {
    display: inline-block;
    width: 200px;
    height: 40px;
    border: 1px solid #64C2EA;
    border-radius: 50px;
    color: #64C2EA !important;
    margin-right: 20px;
    text-align: center;
    line-height: 40px !important;
}
.lesson-list .bt-rating img,#page .bt-lessonnote img,#page .bt-rating img, #page .bt-afterrating img{
    margin-right: 10px;
    vertical-align: middle;
}

#page .bt-afterrating{
    display: inline-block;
    width: 200px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #C5C5C5;
    border-radius: 50px;
    color: #666;
    margin-right: 20px;
    text-align: center;
}

.area-rating button {
   border: 1px solid #0AF;
   border-radius: 30px;
   color: #0AF;
   cursor: pointer;
   background: #fff url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ico_play02.png) 72px center no-repeat;
   padding: 5px 85px 5px 85px;
   font-size: 16px;
}

/***********************************
        area-trial-reg
************************************/
/**************common**************/
#page.area-trial-reg{
    background: #FFFFFF;
    font-size: 14px;
}
#page.area-trial-reg #content{
    width: 744px;
    padding: 80px 0 0 0;
}
#page.area-trial-reg #content.none {
    width: auto;
    padding: 0;
    margin: auto;
}
#page.area-trial-reg .content {
    width: 744px;
    padding: 80px 0 0 0;
    margin: 0 auto;
}
#page.area-trial-reg #content a{
    color: #1166C3;
}
#page.area-trial-reg #content section {
    width: 744px;
    height: 30px;
    border: solid 1px #FF0004;
    color: #FF0004;
    font-size: 13px;
    line-height: 30px;
    font-weight: bold;
    text-align: center;
    box-sizing: border-box;
    margin-bottom: 22px;
}
#page.area-trial-reg #content .btn-wrap{
    display: block;
    text-align: center;
    clear: both;
}
#page.area-trial-reg #content .btn{
    display: block;
    height: 60px;
    line-height: 60px;
    font-size: 20px;
    font-weight: bold;
    color: #FFFFFF;
    background: #555555;
    border-radius: 4px;
    letter-spacing: 2px;
}
#page.area-trial-reg #content .btn-orange{
    background: #fe7821;
}
#page.area-trial-reg #content .btn-darkgrey{
    background: #333333;
}

/**************Step 1**************/
/**************.sect-nav**************/

#page.area-trial-reg #content .sect-nav .nav_01{
    display: block;
    background-image : url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/regist/nav_trial_01.png');
    height: 30px;
}
#page.area-trial-reg #content .sect-nav .nav_02{
    display: block;
    background-image : url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/regist/nav_trial_02.png');
    height: 30px;
    margin: 0 0 60px 0;
}
#page.area-trial-reg #content .sect-nav .nav_03{
    display: block;
    background-image : url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/regist/nav_trial_03.png');
    height: 30px;
    margin: 0 0 60px 0;
}
#page.area-trial-reg #content .sect-nav li{
    display: inline-block;
    float: left;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 12px;
    color: #454545;
    font-weight: bold;
    letter-spacing: 1px;
}
#page.area-trial-reg #content .sect-nav li:nth-of-type(1){
    width: 255px;
}
#page.area-trial-reg #content .sect-nav li:nth-of-type(2){
    width: 245px;
}
#page.area-trial-reg #content .sect-nav li:nth-of-type(3){
    width: 244px;
}
#page.area-trial-reg #content .sect-nav li.active{
    color: #FFFFFF
}

/**************.sect-cp**************/
#page.area-trial-reg #content .sect-cp {
    position: relative;
    width: 100%;
    height: 140px;
    margin: 0 auto;
    padding: 40px 0 0 0;
    text-align: center;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/top/bg_zoryo201702.png) no-repeat;
    background-size: 100%;
    background-position: center;
}
#page.area-trial-reg #content .sect-cp p {
    position: relative;
    font-size: 18px;
    line-height: 18px;
    letter-spacing: 2.2px;
}
#page.area-trial-reg #content .sect-cp p span.orange,
#page.area-trial-reg #content .sect-cp p span.blue,
#page.area-trial-reg #content .sect-cp p span.red {
    font-weight: bold;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(1) {
    color: #666;
    font-weight: bold;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(1) .line {
    position: relative;
    top: 5px;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(1) .line img {
    height: 20px;
    width: 20px;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(2) {
    margin-top: 10px;
    color: #666;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(2) span.orange {
    color: #f70;
    font-weight: bold;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(2) span.blue {
    color: #00A1FF;
    font-weight: bold;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(2) span.december-blue {
    color: #f70;
    font-weight: bold;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(2)::after {
    content: '';
    position: absolute;
    left: 70px;
    bottom: -3px;
    width: 65px;
    height: 65px;
    background: none;
    background-size: 100%;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(3) {
    display: inline-block;
    margin-top: 17px;
    padding: 5px 30px;
    background: #f70;
    color: #fff;
    border-radius: 20px;
    font-size: 16px;
    letter-spacing: 1px;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(3) span {
    font-size: 12px;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(3) img {
    width: 6px;
    margin: 0 7px 0 0;
    vertical-align: middle;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(4) {
    margin-top: 10px;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 1px;
    color: #f90;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(5) {
    position: absolute;
    bottom: 0;
    right: 0px;
}
#page.area-trial-reg #content .sect-cp p:nth-of-type(5) img {
    width: 120px;
}

/**************.sect-recquired**************/
#page.area-trial-reg #content .sect-recquired{
    text-align: center;
}
#page.area-trial-reg #content .sect-recquired-inner{
    display: inline-block;
    border: solid 1px #231816;
    border-radius: 4px;
    padding: 31px;
    text-align: center;
    width: 735px;
    font-size: 14px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#page.area-trial-reg #content .sect-recquired-inner > p{
    display: block;
    font-size: 23px;
    font-weight: bold;
    margin: 0 0 23px 0;
}
#page.area-trial-reg #content .sect-recquired-inner ul{
    display: block;
    height: 80px;
}
#page.area-trial-reg #content .sect-recquired-inner ul li{
    display: inline-block;
    float: left;
    width: 320px;
}
#page.area-trial-reg #content .sect-recquired-inner ul li p{
    margin-bottom: 5px;
}
#page.area-trial-reg #content .sect-recquired-inner ul li:nth-of-type(1){
    margin-right: 30px;
}
#page.area-trial-reg #content .sect-recquired-inner ul .sect-regist{
    color: #fe7821;
}
#page.area-trial-reg #content .sect-recquired-inner ul .sect-login{
    color: #333333;
}
/**************Step 2**************/
/**************.sect-why**************/
#page.area-trial-reg #content .sect-why{
    display: block;
    margin: 0 0 50px 0;
}
#page.area-trial-reg #content .sect-why h1{
    margin: 0 0 20px 0;
}
#page.area-trial-reg #content .sect-why p.desc{
    margin: 0 0 20px 0;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5;
}
#page.area-trial-reg #content .sect-why ul li{
    margin: 0 0 10px 0;
    font-size: 25px;
    color: #fe7821;
}
#page.area-trial-reg #content .sect-why img.float-r{
    margin-top: -10px;
}

/**************.sect-term**************/
#page.area-trial-reg #content .sect-term{
    display: block;
    text-align: center;
    margin: 0 0 30px 0;
}
#page.area-trial-reg #content .sect-term .term-bubble{
    display: inline-block;
    background-image : url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/regist/term_bubble.png');
    width: 735px;
    height: 122px;
    padding: 22px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 0 10px 0;
}
#page.area-trial-reg #content .sect-term .term-bubble h2{
    font-size: 26px;
    margin-bottom: 10px;
}
#page.area-trial-reg #content .sect-term .term-bubble .txt-red{
    color: #FF0000;
}
#page.area-trial-reg #content .sect-term .btn-wrap{
    margin: 20px 0 0 0;
}
#page.area-trial-reg #content .sect-term .btn{
    display: inline-block;
    width: 290px;
}
#page.area-trial-reg #content .note > p{
    font-size: 12px;
    text-align: center;
    line-height: 1.7;
}
#page.area-trial-reg #content .note > label{
    display: block;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px dashed #ddd;
    font-size: 12px;
    text-align: center;
    line-height: 1.7;
}
/**************.sect-complete**************/
#page.area-trial-reg #content .sect-complete{
    text-align: center;
    margin: 0 0 40px 0;
}
#page.area-trial-reg #content .sect-complete > p{
    line-height: 2;
    margin: 0 0 30px 0;
}
#page.area-trial-reg #content .sect-complete .btn-wrap{
    margin: 0 0 40px 0;
}
#page.area-trial-reg #content .sect-complete .btn{
    display: inline-block;
    width: 290px;
    height: 60px;
    border-radius: 60px;
    border-bottom: 5px solid #CE6422;
}
#page.area-trial-reg #content .sect-complete a{
    text-decoration: underline;
}

/**
    lets-lesson
**/
#page.area-trial-reg #content .sect-complete .lets-lesson {
    width: 100%;
    padding: 45px 0 30px;
    background: #ffe4d3;
    margin-bottom: 40px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center {
    width: 744px;
    margin: 0 auto;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center h2 {
    position: relative;
    font-size: 26px;
    line-height: 26px;
    letter-spacing: 2px;
    text-align: center;
    color: #FD7821;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center h2::after {
    content: '';
    width: 84px;
    height: 83px;
    position: absolute;
    right: 50px;
    bottom: 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/trial/within15minutes.png);
    background-size: cover;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .re-teachers {
    width: 100%;
    height: 40px;
    font-size: 18px;
    letter-spacing: 2px;
    color: #333333;
    line-height: 40px;
    text-align: center;
    border-radius: 40px;
    background: #FFF;
    margin-top: 15px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .re-teachers span {
    color: #ed1c24;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers {
    width: 100%;
    margin-top: 20px;
    text-align: center;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl {
    display: inline-block;
    width: 175px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl ~ dl {
    margin-left: 9px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dt {
    width: 100%;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dt a {
    display: block;
    position: relative;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dt a img {
    width: 100%;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl.jp-support dt a::after,#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl.beginner-support dt a::after {
    content: '';
    width: 109px;
    height: 76px;
    position: absolute;
    right: 0;
    bottom: 0;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl.jp-support dt a::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/trial/japanesesupport.png);
    background-size: cover;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl.beginner-support dt a::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/trial/forbegginer.png);
    background-size: cover;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd {
    width: 100%;
    padding: 15px;
    background: #FFF;
    box-sizing: border-box;
    border-bottom: 4px solid #ffe4d3;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd:nth-of-type(4) {
    padding: 1px 0 0 0;
    background: none;
    border-bottom: none;
    font-size: 12px;
    text-align: center;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd:nth-of-type(4) a {
    color: #3997dc;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd p:first-of-type {
    font-size: 14px;
    line-height: 14px;
    letter-spacing: -1px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd p:first-of-type small {
    font-size: 10px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd:nth-of-type(2) p,
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd:nth-of-type(3) p {
    margin-bottom: 5px;
    text-align: center;
    font-size: 13px;
    color: #fd7821;
    letter-spacing: .5px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd p.gray {
    color: #ccc;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd img {
    width: 100%;
    height: auto;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd p:nth-of-type(2) {
    font-size: 10px;
    line-height: 10px;
    margin-top: 7px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd p:nth-of-type(2) img {
    width: 15px;
    height: 10px;
    padding-right: 5px;
    vertical-align: top;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li.book
{
    width: 100%;
    padding: 5px 12px;
    border-bottom: 3px solid #D3921A;
    background: #FEAE14;
    border-radius: 5px;
    text-align: center;
    box-sizing: border-box;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li.empty
{
    width: 100%;
    height: 26px;
    line-height: 26px;
    box-sizing: border-box;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li.absence
{
    width: 100%;
    height: 26px;
    line-height: 26px;
    font-size: 10px;
    color: #999;
    box-sizing: border-box;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li.book:hover {
    cursor: pointer;
    opacity: 0.7;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li.done {
    width: 100%;
    font-size: 10px;
    height: 26px;
    line-height: 26px;
    text-align: center;
    color: #999;
    box-sizing: border-box;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li a {
    display: block;
    font-size: 12px;
    font-weight: bold;
    line-height: 12px;
    color: #FFF;
    text-decoration: none;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li a span {
    display: inline-block;
    height: 13px;
    line-height: 13px;
    font-size: 10px;
    color: #FEAE14;
    text-align: center;
    padding: 0 10px;
    background: #FFF;
    border-radius: 13px;
    margin-right: 5px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-teachers dl dd ul li {
    margin-top: 12px;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-book {
    display: block;
    width: 450px;
    height: 60px;
    line-height: 60px;
    font-size: 21px;
    letter-spacing: 2px;
    font-weight: bold;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    border-bottom: 5px solid #CE6422;
    border-radius: 60px;
    margin: 30px auto 0;
    background: #FD7821;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-book-new {
    display: inline-block;
    margin: 28px auto 0;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-book-new img {
    width: 194px;
    height: auto;
}
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-book:hover,
#page.area-trial-reg #content .sect-complete .lets-lesson .lets-lesson-center .lets-book-new:hover {
    opacity: 0.7;
}
/**************.sect-caution**************/
#page.area-trial-reg #content .sect-caution{
    display: block;
    text-align: center;
}
#page.area-trial-reg #content .sect-caution-inner{
    display: inline-block;
    font-size: 12px;
    width: 650px;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}
#page.area-trial-reg #content .sect-caution p{
    display: block;
    height: 24px;
    line-height: 24px;
    background: #d7d5d6;
    text-align: center;
    font-weight: bold;
    border-radius: 4px 4px 0 0;
    letter-spacing: 10px;
    margin: 0;
}
#page.area-trial-reg #content .sect-caution ul{
    display: block;
    position: relative;
    padding: 10px 0 12px 15px;
    letter-spacing: 0;
    white-space: nowrap;
    text-align: left;
    line-height: 1.6;
    border: solid 2px #EAEAEA;
    border-top: 0;
    border-radius: 0 0 4px 4px;
    font-size: 12px;
    margin: 0;
}

.btn-grayline-radius {
    width: 175px;
    position: relative;
    display: block;
    text-align: center;
    margin-top: 12px;
    background-color: #FFFFFF;
    border: 1px solid #515151;
    height: 32px;
    line-height: 32px !important;
    font-size: 12px;
    font-weight: bold;
    color: #515151;
    border-radius: 16px;
}
#content dl dd .change_contents {
    float: left;
    height: 32px;
    width: 50%;
}

#content dl dd .change_contents button, .cancel_contents a {
  margin: 0 0 10px;
}

#content dl dd .change_contents .cancel {
    display:block;
    height: 100%;
    line-height: 32px;
    float: right;
    margin-right: 16px;
    vertical-align: middle;
}

#content dl dd .change_contents .btn_skypeblue {
    width: 175px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    display: block;
    color: #2fa6f5;
    background: #FFFFFF;
    border-color: #2fa6f5;
    border-radius: 16px;
    font-size: 12px;
    font-weight: bold;
    border: 1px solid #2fa6f5;
    margin-bottom: 8px;
}
#w .text_title {
    height: 90px;
    text-align: center;
    font-size: 23px;
    line-height: 90px;
    font-weight: bold;
    background-color: #FFFFFF;
}

#w .teikei {
    margin-right: 20px;
    margin-bottom: 25px;
}

.ralph_container .ralph2 .number　{
    font-size: 13px;
}

.request .text_audio .browselimit{
    width: 282px;
    height: 20px;
    font-size: 12px;
    font-weight: bold;
    padding: 0 0 6px 10px;
    color: #ffffff;
    position:relative;
    background:#ff0004;
    margin-top: 15px;
}
.request .text_audio .browselimit:after{
    content:" ";
    position:absolute;
    top:0px;
    left:100%;
    width:0;
    height:0;
    border-width:13px 7px;
    border-style:solid;
    border-color:#ff0004;
    border-right-color:transparent;
}

.request .text_audio audio {
    margin-top: 10px;
    width: 300px;
    height: 30px;
}

.request .text_audio .text_etsuran {
    line-height: 32px;
}

.top_etsuran {
    margin: 6px 10px 0 0;
}

/*contact_page2.html*/
#main-src .list-boxpagenation .select_box {
    width: 110px;
    height: 25px;
    position: relative;
    background: #FFFFFF!important;
    opacity: 1!imporatn;
    line-height: 20px;
    text-align: center;
    overflow: hidden;
    float: left;
    border-radius: 3px;
}
#main-src .list-boxpagenation .select_box:after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    top: 11px;
    right: 10px;
    border-top:solid 4px #3C3C3C;
    border-right:solid 4px transparent;
    border-bottom:solid 4px transparent;
    border-left:solid 4px transparent;
}

#main-src .list-boxpagenation .select_box select {
    width: 150px;
    height: 25px;
    padding-left: 10px;
    opacity: 1!important;
    background: #FFFFFF;
    float: left;
    outline:none;
    border: medium none;
}

#main-src .list-boxpagenation .select_box select:focus {
    outline:none;
}

#main-src .list-boxpagenation .select_box select * {
    outline: none!important;
    border: none!important;
}

#main-src .list-boxpagenation p {
    margin: 0;
    line-height: 19px;
    margin: 3px 0px 0px 20px;
}

#main-src .list-boxcaptside {
    overflow: hidden;
    margin-bottom: 20px;
}

#main-src .list-boxpagenation ul {
    text-align: center;
    list-style: none;
    list-style-position: outside;
    padding-top: 25px;
}

#main-src .list-boxpagenation ul li {
    display: inline-block;
    vertical-align: top;
}

.new_inquire_btn {
    display: block;
    width: 290px;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    margin: 25px auto 0;
    text-align: center;
    background: #FFA500;
    border-radius: 20px;
    color: #FFFFFF!important;
}

#main-src .list-boxpagenation .inquire:hover {
    opacity: 0.7;
}

#main-src .list-boxpagenation .inquire_text {
    font-size: 12px;
    text-align: center;
    margin-top: 25px;
    margin-left: 0;
}

#main-src .list-boxpagenation .inquire_text a {
    color: #2FA6F5;
    text-decoration: underline;
}

#main-src ul li dl dd p {
    line-height: 20px;
}

#main-src ul li dl dd p .in_detail:hover {
    text-decoration: underline;
}

#main-src .list-boxpagenation li:hover {
    background-color: #E1E1E1;
}
#main-src .list-boxpagenation li:hover a {
    color: #FFFFFF;
}
#main-src .list-boxpagenation ul li.prev:hover,
#main-src .list-boxpagenation ul li.next:hover,
#main-src .list-boxpagenation ul li.terminal:hover {
    background: none;
}
#main-src .list-boxpagenation li.prev:hover,
#main-src .list-boxpagenation li.next:hover,
#main-src .list-boxpagenation li.terminal:hover {
    background-color: none;
}
#main-src .list-boxpagenation li.prev:hover a,
#main-src .list-boxpagenation li.next:hover a,
#main-src .list-boxpagenation li.terminal:hover a {
    color: #000000;
    text-decoration: underline;
}

#main-src .list-boxpagenation ul li span.lt {
    background-color: #e1e1e1;
}

#main-src .list-boxpagenation ul li {
    height: 32px;
    width: 32px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: bold;
    line-height: 32px;
    text-align: center;
    margin-right: 5px;
    border: 1px solid #E1E1E1;
}

#main-src .list-boxpagenation ul li.prev,
#main-src .list-boxpagenation ul li.next,
#main-src .list-boxpagenation ul li.terminal {
    border: none;
}

#main-src .list-boxpagenation ul li.active {
    color: #FFFFFF;
    background: #E1E1E1;
}

#main-src .list-boxpagenation ul li i {
    font-size: 20px;
    line-height: 30px;
}

#main-src .list-boxpagenation ul li:nth-last-child(1) i,
#main-src .list-boxpagenation ul li:nth-last-child(2) i {
    padding-left: 3px;
}

#main-src .list-boxpagenation li.terminal a {
    width: auto;
    white-space: nowrap;
}

#main-src .list-boxpagenation .dot {
    display: block;
    color: #000;
    font-size: 13px;
    text-align: center;
    line-height: 25px;
    margin: 0;
    padding-left: 2px;
}
/*list_reservation_free_course.html*/

#main-src .list-boxcaptside .list-unit .list-ttl {
    line-height: 20px;
    margin: 0 6px 0 0;
}

#main-src .list-boxcaptside .list-unit p {
    line-height: 22px;
}

/**************Announcement**************/
#page .announcement_box {
    margin-bottom: 15px;
}
#page .announcement_box .announcement {
    position: relative;
    width: 730px;
    margin: 0 auto;
    padding: 10px;
    font-size: 14px;
    color: #FFFFFF;
    box-sizing: border-box;
    text-align: left;
}
#page .announcement_box #emergency {
    background: #e30b17;
}
#page .announcement_box #important {
    background: #FFFFFF;
    border: 2px solid #e30b17;
}
#page .announcement_box .announcement .icon {
    display: block;
    font-weight: bold;
    position: absolute;
    color: #d74447;
    height: 20px;
    line-height: 20px;
    border-radius: 10px;
    padding: 0px 9px 13px 20px;
    box-sizing: border-box;
    top: 0;
    bottom: 0;
    left: 10px;
    margin: auto;
}
#page .announcement_box #emergency .icon {
    background: #FFFFFF;
}
#page .announcement_box .announcement .icon img {
    position: absolute;
    width: 12px;
    vertical-align: top;
    top: 0;
    bottom: 0;
    left: 5px;
    margin: auto;
}
#page .announcement_box .announcement .text {
    display: inline-block;
    line-height: 20px;
    vertical-align: top;
    text-decoration: underline;
    text-align: left;
}
#page .announcement_box #emergency .text {
    width: 610px;
    margin-left: 70px;
    color: #FFFFFF;
}
#page .announcement_box #important .text {
    width: 600px;
    margin-left: 80px;
}
#page .announcement_box #important .text li {
    position: relative;
    color: #e30b17;
    margin-bottom: 10px;
}
#page .announcement_box #important .text li:last-of-type {
    margin-bottom: 0;
}
#page .announcement_box #important .text li p .timeline::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    margin-bottom: 10px;
    background: transparent;
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #e30b17;
    top: 5px;
    left: -10px;
}
#page .announcement_box #important .text li p .timeline {
    text-decoration: underline;
    line-height: 20px;
    color: #D74447;
}
#page .announcement_box #emergency .close_button {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 10px;
}
#page .announcement_box #important .close_button {
    position: absolute;
    top: 10px;
    right: 10px;
}
#page .announcement_box .close_button:hover {
    cursor: pointer;
}
#page .information_box {
    position: relative;
    margin-bottom: 15px;
    padding: 12px 10px 10px 25px;
    background-color: #ffebd6;
}
#page .information_box ul li {
    position: relative;
    margin-bottom: 10px;
    list-style: none;
    font-size: 14px;
}
#page .information_box ul li:last-of-type {
    margin-bottom: 0;
}
#page .information_box ul li::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    margin-bottom: 10px;
    background: transparent;
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #fb9a33;
    top: 5px;
    left: -12px;
}
#page .information_box ul li a {
    color: #5D5D5D;
    text-decoration: underline;
}
#page .information_box .close_button {
    position: absolute;
    top: 15px;
    right: 10px;
}
#page .information_box .close_button:hover {
    cursor: pointer;
}


/*****************************
        Navigation
 ****************************/

.global_header {
    height: 50px;
    line-height: 50px;
    width: 100%;
    min-width: 1010px;
    background: #efefef;
}
.global_header > ul:first-of-type  {
    position: relative;
    width: 750px;
    float: left;
    height: 50px;
    max-height: 50px;
}
.global_header > ul:first-of-type > li {
    position: relative;
    display: block;
    height: 100%;
    text-align: center;
    float: left;
    z-index: 100;
    background: #efefef;
}
.global_header > ul:first-of-type > li:hover {
    cursor: pointer;
}
.global_header > ul:first-of-type > li > a:hover {
    text-decoration: none;
}
.global_header > ul:first-of-type > li::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 27px;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-right: 1px solid #bcbcbc;
}
.global_header > ul:first-of-type > li:nth-of-type(1)::after {
    content: none;
}
.global_header > ul:first-of-type > li > a {
    display: block;
    float: left;
    color: #333333!important;
    padding: 0 15px;
    font-size: 15px;
    position: relative;
    z-index: 100;
}
.global_header > ul:first-of-type > li:not(.active_page):hover::before {
    cursor: pointer;
    position: absolute;
    content: '';
    width: 98%;
    height: 100%;
    top: 0;
    border-bottom: 4px solid #1674b6;
    margin: auto;
    box-sizing: border-box;
    left: 2px;
}
.global_header > ul:first-of-type > li.active_page {
    border-bottom: 4px solid #1674B6;
    box-sizing: border-box;
    margin-left: 2px !important;
}
.global_header > ul:first-of-type > li:first-of-type:hover::before {
    content: none;
}
.global_header > ul:first-of-type > li > h1 {
    font-size: 12px;
    color: #FFFFFF;
    background: #454545;
    padding: 8px 15px 0!important;
    line-height: 16px;
    height: 100%;
    box-sizing: border-box;
    text-align: left;
    font-weight: normal;
    cursor: default;
}
.global_header > ul:first-of-type > li > p {
    font-size: 12px;
    color: #FFFFFF;
    background: #454545;
    padding: 8px 15px 0!important;
    line-height: 16px;
    height: 100%;
    box-sizing: border-box;
    text-align: left;
    font-weight: normal;
    cursor: default;
}
.global_header > ul:first-of-type > li:nth-of-type(3):hover .sub_menu  {
    display: block;
}
.global_header > ul:first-of-type > li .sub_menu {
    display: none;
    position: absolute;
    width: 180px;
    text-align: left;
    top: 100%;
    z-index: 9999;
    background: #efefef;
}
.global_header > ul:first-of-type > li .sub_menu li {
    height: 50px;
    color: #333333!important;
    border-bottom: 1px solid #DEDCDC;
    padding: 0 !important;
}
.global_header > ul:first-of-type > li .sub_menu li:last-of-type {
    border-bottom: none;
}
.global_header > ul:first-of-type > li .sub_menu li a {
    display: block;
    color: #000000;
    font-size: 15px;
    padding-left: 15px;
}
.global_header > ul:first-of-type > li .sub_menu li a:hover {
    text-decoration: none;
    background: #EAE8E8 none repeat scroll 0% 0%;
}
.global_header > ul:first-of-type > li:last-of-type:after {
    border: none;
}

.global_header > ul:last-of-type {
    float: right;
    width: 260px;
    height: 50px;
    max-height: 50px;
}
.global_header > ul:last-of-type > li {
    position: relative;
    height: auto!important;
    background: #ffffff;
    top: 10px;
    display: block!important;
    line-height: 0!important;
    border: 1px solid #FFFFFF;
    border-radius: 19px;
    z-index: 99;
    float: right;
}
.global_header > ul:last-of-type > li:last-of-type {
    right: -100px;
}
.global_header > ul:last-of-type > li:last-of-type a {
    padding-left: 12px;
}
.global_header > ul:last-of-type > li:nth-last-of-type(2) {
    right: 140px;
}
.global_header > ul:last-of-type > li a {
    display: block;
    font-size: 12px;
    color: #000000;
    width: 112px;
    height: 27px;
    line-height: 27px;
    text-align: center;
    padding-left: 8px;
    box-sizing: border-box;
}
.global_header > ul:last-of-type > li a::after {
    position: absolute;
    content: '';
    top: 0;
    left: 12px;
    bottom: 0;
    margin: auto;
}
.global_header > ul:last-of-type > li:last-of-type a::after {
    height: 11px;
    width: 11px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest_g/h_question.png) no-repeat;
    background-size: 100% 100%;
}
.global_header > ul:last-of-type > li:nth-last-of-type(2) a::after {
    height: 9px;
    width: 6px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest_g/h_arrow_right.png) no-repeat;
    background-size: 100% 100%;
}

.global_header > ul:last-of-type li:hover {
    opacity: 0.8;
}
.global_header > ul:last-of-type li:hover a {
    text-decoration: none;
}
.global_header > ul:last-of-type > li::after,nav > ul > li::before {
    content: none;
}
.ralph_container{
    clear: both;
    overflow: hidden;
    margin: 0px auto 0px !important;
}

.header_cont{
    width: 700px;
    height: 52px;
    margin: 0 auto 0px;
}

.canvas_container{
    padding-top: 10px;
    width: 100%;
    height: 1100px;
    margin: 0 auto 0;
    background-image: url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/bg_repeatx.png");
    background-repeat: repeat-y;
    overflow: scroll;
}

.main_canvas{
    width: 700px;
    margin: 0 auto;
}

#the-canvas{
    width: 100%;
    background-color: #FFFFFF;
    box-sizing: border-box;
}

.ralph1, .ralph2{
    width: 50%;
}

.ralph1{
    float: left;
    margin-top: 10px;
}

.ralph2{
    text-align: right;
    float: right;
    vertical-align: middle;
}

.hide{
    display: none;
}

.show{
    display: block;
}

#page #content table.form td #pdficon {
    margin: 6px 10px 0 0;
}
.main_canvas #material_copyright {
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
}

/************** iKnow!強み **************/
#content .area-point-inner .area-iknow {
    display: block;
    position: relative;
    width: 100%;
    box-sizing: border-box;
    background: #FFFFFF;
    overflow: hidden;
    padding: 20px 20px 0 20px;
    border-radius: 15px;
    margin-top: 12px;
}
#content .area-point-inner .area-iknow:hover {
    opacity: 0.7;
}
#content .area-point-inner .area-iknow::after {
    position: absolute;
    top: 0;
    right: 0;
    content: '';
    width: 62px;
    height: 62px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/guest_g/new.png) no-repeat;
    background-position: right top;
}
#content .area-point-inner .area-iknow h4 {
    width: 725px;
    float: right;
    font-size: 21px;
    padding-bottom: 10px;
}
#content .area-point-inner .area-iknow h4 .pink {
    color: #FF3B81;
}
#content .area-point-inner .area-iknow p {
    width: 725px;
    float: right;
    padding: 10px 0 15px;
    color: #666666;
    border-top: 1px solid #f2f2f2;
}
#content .area-iknow > img {
    position: absolute;
    left: 20px;
    bottom: 0;
}
.text-audio-top a{
    margin-bottom: 10px;
    float: none !important;
}

.text-audio-top img, .text-audio-top span{
    display: inline-block;
    vertical-align: middle;
    float: none !important;
    width: auto !important;
    margin: 0 !important;
}

.text-audio-top img{
    position: relative;
    top: -2px;
}

/*****************************
        Tickets
****************************/
#page .two_ticket h2 {
    font-weight: normal;
    font-size: 14px;
}
#page .two_ticket .ticket_inline {
    overflow: hidden;
    padding-top: 35px;
}
#page .two_ticket .ticket_inline section {
    width: 290px;
    height: 210px;
    text-align: center;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ticket_bg.png) no-repeat;
    background-size: cover;
    box-sizing: border-box;
    padding-right: 25px;
}
#page .two_ticket .ticket_inline section a:hover {
    cursor: pointer;
}
#page .two_ticket .ticket_inline section:first-of-type {
    float: left;
}
#page .two_ticket .ticket_inline section:last-of-type {
    float: right;
}
#page .two_ticket .ticket_inline section > p:first-of-type {
    display: inline-block;
    height: 30px;
    font-size: 17px;
    line-height: 30px;
    text-align: center;
    background: #EFEFEF;
    border-radius: 10px;
    margin-top: 25px;
    padding: 0 14px;
}
#page .two_ticket .ticket_inline section > p:first-of-type img {
    display: inline-block;
    padding-top: 5px;
    width: 35px;
    vertical-align: top;
}
#page .two_ticket .ticket_inline section > p:first-of-type img.pt0 {
    padding-top: 0;
}
#page .two_ticket .ticket_inline section h3 {
    width: 100%;
    text-align: center;
    font-size: 48px;
    line-height: 48px;
    padding-top: 20px;
    color: #454545;
}
#page .two_ticket .ticket_inline section h3 span {
    padding: 4px;
}
#page .two_ticket .ticket_inline section h3 .small {
    font-size: 17px;
    line-height: 17px;
}
#page .two_ticket .ticket_inline section h3 .small .more_small {
    font-size: 14px;
    line-height: 14px;
}
#page .two_ticket .ticket_inline section .sell_tickets,#page .two_ticket .ticket_inline section p:nth-of-type(2) {
    margin-top: 20px;
}
#page .two_ticket .ticket_inline section .sell_tickets {
    position: relative;
    width: 145px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #FB7832;
    padding: 0 10px;
    margin: 20px auto 0;
    overflow: hidden;
}
#page .two_ticket .ticket_inline section .sell_tickets::after {
    position: absolute;
    content: '';
    width: 0px;
    height: 0px;
    left: 55px;
    top: 17px;
    border: 5px solid transparent;
    border-top: 5px solid #FB7832;
}
#page .two_ticket .ticket_inline section .sell_tickets h3 {
    width: 100%;
    text-align: center;
    font-size: 48px;
    line-height: 48px;
    padding-top: 20px;
}
#page .two_ticket .ticket_inline section .sell_tickets select {
    width: 70px;
    position: absolute;
    background: none;
    border: none;
    -webkit-appearance: none;
    left: 0;
    font-size: 17px;
    line-height: 40px;
    box-sizing: border-box;
    padding-left: 18px;
    color: #FB7832;
}
#page .two_ticket .ticket_inline section .sell_tickets select:focus {
    outline-color: #FFFFFF;
}
#page .two_ticket .ticket_inline section .sell_tickets a {
    display: inline-block;
    position: absolute;
    width: 95px;
    height: 100%;
    right: 0;
    line-height: 40px;
    font-size: 17px;
    color: #FFFFFF;
    background: #FB7832;
}
#page .two_ticket .ticket_inline section > a {
    display: block;
    width: 145px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #FB7832;
    background: #FB7832;
    color: #FFFFFF;
    border-radius: 20px;
    font-size: 17px;
    margin: 20px auto 0;
}
#page .two_ticket .ticket_example {
    display: block;
    margin-top: 35px;
}

#page #content div.area-lesson .msg-box {
    display: block;
    border: solid 1px #FF0000;
    color: #FF0000;
    text-align: center;
    padding: 8px 0;
    margin: 0 0 8px 0;
    font-weight: bold;
}

/***********************
        Pop up
************************/
.n_pop_up_bg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.5);
    z-index: 100;
}
.n_pop_up > div {
    display: none;
    position: absolute;
    width: 500px;
    left: 0;
    right: 0;
    top: 50px;
    margin: 0 auto;
    padding: 50px 30px 45px;
    background: #FFFFFF;
    z-index: 200;
    box-sizing: border-box;
}
.n_pop_up .title {
    text-align: center;
    font-size: 14px;
    font-weight: normal;
    line-height: 24px;
    margin-bottom: 10px !important;
    word-wrap: break-word;
}

.n_pop_up .free_title {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    line-height: 24px;
    margin: 0 0 40px 0 !important;
    word-wrap: break-word;
}

.n_pop_up ul li {
    font-size: 14px;
    font-weight: normal;
    line-height: 24px;
    margin: 0 0 5px 10px !important;
    word-wrap: break-word;
    list-style: disc;
}
.n_pop_up ul li:last-child {
    margin: 0 0 20px 10px !important;
}

.n_pop_up ul.free_list li {
    margin: 0 0 15px 0 !important;
    padding: 0 0 20px 0 !important;
    text-align: center;
    font-size: 14px;
    font-weight: normal;
    line-height: 24px;
    border-bottom: 1px dashed #ddd;
    word-wrap: break-word;
    list-style: none;
}
.n_pop_up ul.free_list li:last-child {
    margin: 0 0 20px 0 !important;
    border-bottom: none;
}
.n_pop_up .button {
    text-align: center;
    padding-top: 10px !important;
    margin: 0;
}
.n_pop_up .button a {
    display: inline-block;
    width: 90px;
    height: 12px;
    padding: 10px 0 5px 0;
    border-radius: 20px;
    font-size: 12px;
    line-height: 6px;
    text-decoration: none;
}
.n_pop_up .button a.not_change {
    color: #2FA6F5;
    border: 1px solid #2FA6F5;
}
.n_pop_up .button a.change {
    background: #2FA6F5;
    color: #FFFFFF;
    margin-left: 10px;
}
.n_pop_up .button a.plan {
    background: #2FA6F5;
    color: #FFFFFF;
    width: auto;
    padding: 10px 15px 5px 15px;
}
.n_pop_up .button a.lesson {
    background: #2FA6F5;
    color: #FFFFFF;
    width: auto;
    margin-bottom: 10px !important;
    padding: 17px 30px 10px 30px;
    font-size: 15px;
}
.n_pop_up .button a.free {
    background: #2FA6F5;
    color: #FFFFFF;
    width: 200px;
    height: 25px;
    font-size: 14px;
    line-height: 20px;
}
.n_pop_up button.button {
    display: block;
    background: #2FA6F5;
    color: #FFFFFF;
    width: auto;
    margin: 10px auto 0 auto;
    padding: 20px 15px 10px 15px;
    font-size: 12px;
    line-height: 15px;
    text-decoration: none;
    border-radius: 20px;
    cursor: pointer;
}
/*comment out this change*/
/*https://github.com/bibopg/helium.dmm.co.jp/commit/8d239162fdae9e47c6d198b1f6f17520d7d68c17*/
/*.n_pop_up form ul.agreement_checkbox li {
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
    margin: 10px 0 5px 10px !important;
    word-wrap: break-word;
    list-style: none;
}
.n_pop_up form ul.agreement_checkbox li input {
    margin-right: 10px;
}
.n_pop_up form p {
    display: block;
    margin-top: 10px !important;
    padding: 5px 0 !important;
    border: 1px solid #f00;
    color: #f00;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
}*/
.n_pop_up .close_btn {
    width: 20px;
    position: absolute;
    top: -6px;
    right: -7px;
}
.n_pop_up .close_btn:hover {
    cursor: pointer;
}
.n_pop_up .urgent_time {
    font-weight: bold;
}
.n_pop_up .urgent_title {
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px dotted #ccc;
    font-size: 15px;
    font-weight: bold;
}
.n_pop_up .evalute_teacher {
    width: 720px;
}
.n_pop_up .evalute_teacher .title {
    font-size: 28px;
    line-height: 38px;
    letter-spacing: 2px;
    color: #FF8400;
    font-weight: bold;
}
.n_pop_up .evalute_teacher .sub_title {
    font-size: 17px;
    line-height: 17px;
    letter-spacing: 1px;
    color: #3D3D3D;
    text-align: center;
    margin-top: 25px!important;
}
.n_pop_up .evalute_teacher .profile {
    width: 100%;
    background: #F8F8F8;
    margin-top: 30px;
    padding: 30px 0;
}
.n_pop_up .evalute_teacher .profile .detail {
    width: 100%;
    display: inline-block;
    text-align: center;
}
.n_pop_up .evalute_teacher .profile .detail dl {
    display: inline-block;
    padding: 15px 0 0 20px!important;
    box-sizing: border-box;
    text-align: left;
    vertical-align: top;
}
.n_pop_up .evalute_teacher .profile .detail dl dt {
    font-size: 19px;
    line-height: 19px;
    font-weight: bold;
    color: #333333;
}
.n_pop_up .evalute_teacher .profile .detail dl dt .kana {
    font-size: 17px;
    line-height: 17px;
    padding-left: 10px;
    font-weight: normal;
}
.n_pop_up .evalute_teacher .profile .detail dl dt .country {
    width: 22px;
    vertical-align: top;
    position: relative;
    top: 1px;
}
.n_pop_up .evalute_teacher .profile .detail dl dd {
    font-size: 17px;
    line-height: 17px;
    color: #333333;
    padding-top: 10px!important;
}
.n_pop_up .evalute_teacher .profile .detail .teacher {
    display: inline-block;
    width: 80px;
    height: 80px;
    border-radius: 40px;
    vertical-align: top;
}
.n_pop_up .evalute_teacher .profile .stars {
    display: table;
    width: 420px;
    margin: 20px auto 0!important;
}
.n_pop_up .evalute_teacher .profile .stars li {
    display: table-cell;
    width: 20%;
}
.n_pop_up .evalute_teacher .profile .stars li:hover {
    cursor: pointer;
}
.n_pop_up .evalute_teacher .profile .stars li img {
    width: 64px;
    height: 61px;
}
.n_pop_up .evalute_teacher .lesson {
    display: none;
    width: 100%;
    margin: 0 0 0!important;
    background: #F1F1F1;
    padding: 35px 0 24px;
}
.n_pop_up .evalute_teacher .lesson > p:nth-of-type(1) {
    font-size: 17px;
    line-height: 17px;
    text-align: center;
    letter-spacing: 0.12em;
}
.n_pop_up .evalute_teacher .lesson > p span#fontRed {
    color: #FF0000;
    font-size: 14px;
    letter-spacing: 0.12em;
}
.n_pop_up .evalute_teacher .lesson > ul {
    display: block;
    width: 660px;
    padding: 30px 30px 20px!important;
    text-align: center;
    box-sizing: border-box;
}
.n_pop_up .evalute_teacher .lesson > ul:after {
    content: '';
    clear: both;
    height: 0;
}
.n_pop_up .evalute_teacher .lesson > ul li {
    display: inline-block;
    width: 300px;
    list-style-type: none;
    margin: 0!important;
    font-size: 14px;
    line-height: 14px;
    text-align: left;
    float: left;
    letter-spacing: 0.16em;
}
.n_pop_up .evalute_teacher .lesson > ul li:nth-of-type(2) ~ li {
    padding-top: 20px!important;
}
.n_pop_up .evalute_teacher .lesson > ul li input {
    vertical-align: top;
    margin: 0!important;
}
.n_pop_up .evalute_teacher .lesson textarea {
    width: 600px;
    height: 55px;
    display: block;
    margin: 0 auto;
    border: solid 1px #E6E6E6;
    resize: vertical;
    display: none;
    padding: 5px;
}
.n_pop_up .evalute_teacher .lesson textarea:placeholder-shown {
    font-size: 14px;
    color: #9D9D9D;
    padding: 5px;
}
.n_pop_up .evalute_teacher .comment {
    width: 295px;
    height: 35px;
    font-size: 17px;
    line-height: 36px;
    border: 1px solid #EEEEEE;
    margin: 35px auto!important;
    text-align: center;
}
.n_pop_up .evalute_teacher .comment.on {
    display: none;
}
.n_pop_up .evalute_teacher .comment:hover {
    cursor: pointer;
}
.n_pop_up .evalute_teacher .comment + textarea {
    display: none;
    width: 100%;
    min-width: 100%;
    height: 125px;
    max-height: 125px;
    font-size: 14px;
    line-height: 17px;
    border: 1px solid #EEEEEE;
    margin: 35px auto!important;
    color: #777777;
    padding: 10px;
    box-sizing: border-box;
}
.n_pop_up .evalute_teacher .comment + textarea:placeholder-shown {
    color:#777777;
}
.n_pop_up .evalute_teacher .comment.on + textarea {
    display: block;
}
.n_pop_up .evalute_teacher .error {
    font-size: 14px;
    text-align: center;
    padding-top: 10px!important;
    color: #FF0000;
}
.n_pop_up .evalute_teacher .button {
    width: 340px;
    height: 55px;
    line-height: 55px;
    font-size: 19px;
    border-radius: 28px;
    padding: 0!important;
    color: #FFF;
    background: #D1D1D1; /*2016/10/11 UpDate.*/
}
.n_pop_up .evalute_teacher .button.on { /*2016/10/11 UpDate.*/
    background: #FF8400;
}
.n_pop_up .evalute_teacher .check {
    text-align: center;
    margin-top: 35px!important;
    font-size: 14px;
}
.n_pop_up .evalute_teacher .check input {
    display: inline-block;
    vertical-align: top;
}
/*.n_pop_up .evalute_teacher .comment.on + textarea + button + p.check + .evalute_list {*/
/*+ p.error doesn't exist in helium*/
.n_pop_up .evalute_teacher .comment.on + textarea + p.error + button + p.check + .evalute_list {
    display: block!important;
}
.n_pop_up .lesson_note_pop_up {
  width: 620px;
  padding-bottom: 26px;
}
.n_pop_up .lesson_note_pop_up p {
  font-size: 14px;
  letter-spacing: 0;
  line-height: 1.71428571428571em;
  margin: 0 0 4px 0;
}
.n_pop_up .lesson_note_pop_up p strong {
  margin: 0 0 3px 0;
  display: inline-block;
}
.n_pop_up .lesson_note_pop_up p span {
  font-size: 12px;
  letter-spacing: 0;
  color: #808080;
}
.n_pop_up .lesson_note_pop_up .imgBox {
  width: 380px;
  margin: 0 auto;
}
.n_pop_up .lesson_note_pop_up .imgBox img {
  width: 100%;
}
.n_pop_up .lesson_note_pop_up p.button {
  padding-top: 20px !important;

}
.n_pop_up .lesson_note_pop_up .button a.not_change {
  font-size: 12px;
  letter-spacing: 0.04em;
  font-weight: bold;
  width: 175px;
  height: 32px;
  border-radius: 16px;
  background-color: #cccccc;
  display: inline-block;padding: 0;
  line-height: 32px;
  text-decoration: none;
  border: none;
  color: #000;
}
.n_pop_up .double_bg {
    display: block;
    background: #F2F2F2;
    position: absolute;
    left: -40px;
    top: 70px;
    right: 0;
    margin: auto;
    z-index: 110;
}
.n_pop_up .bg_shadow {
    box-shadow: 0px 2px 2px rgba(102, 102, 102, 0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(102, 102, 102, 0.3);
    -moz-box-shadow: 0px 2px 2px rgba(102, 102, 102, 0.3);
}
.n_pop_up .evalute_list {
    display: none;
    margin: 20px 5px 0 0!important;
}
.n_pop_up .evalute_list li {
    font-size: 12px;
    line-height: 16px;
    color: #CCCCCC;
}
.n_pop_up .evalute_list li a {
    color: #CCCCCC;
    text-decoration: underline;
}
.n_pop_up .evalute_list li ~ li {
    padding-top: 5px;
}

.n_pop_up .skype-check-link {
    display: block;
    margin: 20px 0 10px 0;
    font-size: 15px;
    font-weight: bold;
    text-decoration: underline;
    color: #2FA6F5!important;
}
.n_pop_up .skype-check-img {
    display: block;
    width: 100%;
    height: auto;
    margin: 20px 0;
}
.evalute_teacher .defaultDisplay {
    display: none;
}
/**
 * Ticket
 */
#page .two_ticket h1 {
    font-size: 36px;
    line-height: 36px;
    padding: 20px 0 20px;
}
#page .two_ticket .ticket_block {
    padding: 40px 35px;
    background: #FFFFFF;
}
#page .two_ticket .ticket_block .sub_top_h2 {
    position: relative;
    font-size: 19px;
    line-height: 19px;
    color: #505050;
    text-align: center;
}
#page .two_ticket .ticket_block .sub_top_h2::after {
    content: '';
    width: 26px;
    height: 18px;
    position: absolute;
    right: 180px;
    top: 6px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ballon_right.png);
}
#page .two_ticket .ticket_block .sub_top_h2::before {
    content: '';
    width: 19px;
    height: 19px;
    position: absolute;
    left: 178px;
    top: 7px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ballon_left.png);
}
#page .two_ticket .ticket_block h2 {
    font-size: 40px;
    line-height: 40px;
    padding-top: 15px;
    color: #00AAF1;
    text-align: center;
}
#page .two_ticket .ticket_block .sub_under_h2 {
    font-size: 14px;
    line-height: 24px;
    padding-top: 15px;
    letter-spacing: 1.4px;
    color: #999999;
    text-align: center;
}
#page .two_ticket .ticket_block .sub_under_h2 .orange {
    color: #FD5014;
    font-weight: bold;
}
#page .two_ticket .ticket_block .attention_small {
    font-size: 12px;
    line-height: 12px;
    padding-top: 13px;
    color: #999999;
    text-align: center;
}
#page .two_ticket .ticket_block .ticket_inline {
    overflow: hidden;
    padding-top: 35px;
}
#page .two_ticket .ticket_block .ticket_inline section {
    width: 325px;
    height: 200px;
    text-align: center;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/ticket_bg.png) no-repeat;
    background-size: cover;
    box-sizing: border-box;
    padding-right: 40px;
}
#page .two_ticket .ticket_block .ticket_inline section a:hover {
    cursor: pointer;
}
#page .two_ticket .ticket_block .ticket_inline section:first-of-type {
    float: left;
}
#page .two_ticket .ticket_block .ticket_inline section:last-of-type {
    float: right;
}
#page .two_ticket .ticket_block .ticket_inline section > p:first-of-type {
    display: inline-block;
    height: 30px;
    font-size: 17px;
    line-height: 31px;
    text-align: center;
    background: #FFFFFF;
    border-radius: 10px;
    margin-top: 25px;
    padding: 0 14px;
}
#page .two_ticket .ticket_block .ticket_inline section > p:first-of-type img {
    display: inline-block;
    padding-top: 5px;
    width: 35px;
    vertical-align: top;
}
#page .two_ticket .ticket_block .ticket_inline section > p:first-of-type img.pt0 {
    padding-top: 0;
}
#page .two_ticket .ticket_block .ticket_inline section h3 {
    width: 100%;
    text-align: center;
    font-size: 48px;
    line-height: 48px;
    padding-top: 20px;
    color: #454545;
}
#page .two_ticket .ticket_block .ticket_inline section h3 span {
    padding: 4px;
}
#page .two_ticket .ticket_block .ticket_inline section h3 .small {
    font-size: 17px;
    line-height: 17px;
}
#page .two_ticket .ticket_block .ticket_inline section h3 .small .more_small {
    font-size: 14px;
    line-height: 14px;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets,#page .two_ticket .ticket_block .ticket_inline section p:nth-of-type(2) {
    margin-top: 20px;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets {
    position: relative;
    width: 145px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #FB7832;
    padding: 0 10px;
    margin: 20px auto 0;
    overflow: hidden;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets::after {
    position: absolute;
    content: '';
    width: 0px;
    height: 0px;
    left: 55px;
    top: 17px;
    border: 5px solid transparent;
    border-top: 5px solid #FB7832;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets h3 {
    width: 100%;
    text-align: center;
    font-size: 48px;
    line-height: 48px;
    padding-top: 20px;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets select {
    width: 70px;
    height: 40px;
    line-height: 40px;
    position: absolute;
    background: none;
    border: none;
    left: 0;
    font-size: 17px;
    box-sizing: border-box;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    padding-left: 20px;
    background: #FFFFFF;
    color: #FB7832;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets select::-ms-expand {
    display: none;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets select:focus {
    outline-color: #FFFFFF;
}
#page .two_ticket .ticket_block .ticket_inline section .sell_tickets a {
    display: inline-block;
    position: absolute;
    width: 95px;
    height: 100%;
    right: 0;
    line-height: 40px;
    font-size: 17px;
    color: #FFFFFF;
    background: #FB7832;
}
#page .two_ticket .ticket_block .ticket_inline section > a {
    display: block;
    width: 145px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #FB7832;
    background: #FB7832;
    color: #FFFFFF;
    border-radius: 20px;
    font-size: 17px;
    margin: 20px auto 0;
}
#page .two_ticket .ticket_block .convenient_ticket {
    position: relative;
    height: 45px;
    font-size: 21px;
    font-weight: bold;
    line-height: 45px;
    text-align: center;
    color: #00AAF1;
    background: #F0FAFE;
    border-radius: 22px;
    margin-top: 40px;
}
#page .two_ticket .ticket_block .convenient_ticket::after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border: 20px solid transparent;
    border-top: 20px solid #F0FAFE;
    left: 55px;
    bottom: -39px;
}
#page .two_ticket .ticket_block .example {
    position: relative;
    width: 100%;
    height: 210px;
    padding: 30px 25px 20px;
    border-right: 5px solid #F7F7F7;
    border-left: 5px solid #F7F7F7;
    border-bottom: 5px solid #F7F7F7;
    border-radius: 20px;
    box-sizing: border-box;
}
#page .two_ticket .ticket_block .example::before {
    position: absolute;
    content: '';
    width: 640px;
    height: 48px;
    left: 5px;
    top: -8px;
}
#page .two_ticket .ticket_block .example ~ .example {
    margin-top: 30px;
}
#page .two_ticket .ticket_block .example dl {
    width: 370px;
    float: left;
}
#page .two_ticket .ticket_block .example dl dt {
    font-size: 26px;
    font-weight: bold;
    line-height: 34px;
    letter-spacing: 2.4px;
    padding-top: 20px;
}
#page .two_ticket .ticket_block .example_wrap {
    margin-top: 40px;
}
#page .two_ticket .ticket_block .example_wrap .example > img {
    vertical-align: top;
    float: right;
}
#page .two_ticket .ticket_block .example_wrap .example dl dd {
    font-size: 14px;
    line-height: 19px;
    padding-top: 10px;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(1)::before {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/example_bg_01.png) no-repeat;
    background-size: cover;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(1) dt {
    color: #00AAF1;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(1) > img {
    width: 155px;
    height: 123px;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(2)::before {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/example_bg_02.png) no-repeat;
    background-size: cover;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(2) dt {
    color: #FD6EA0;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(2) > img {
    width: 221px;
    height: 143px;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(3)::before {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/example_bg_03.png) no-repeat;
    background-size: cover;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(3) dt {
    color: #00AAA0;
}
#page .two_ticket .ticket_block .example_wrap .example:nth-of-type(3) > img {
    width: 185px;
    height: 145px;
}
#page .two_ticket .ticket_block .question {
    margin-top: 30px;
}
#page .two_ticket .ticket_block .question > p {
    position: relative;
    font-size: 18px;
    line-height: 18px;
    color: #666666;
    padding-left: 23px;
}
#page .two_ticket .ticket_block .question > p::after {
    position: absolute;
    content: '';
    width: 18px;
    height: 18px;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/extention.png);
    background-size: cover;
    left: 0;
    top: 0;
}
#page .two_ticket .ticket_block .question ul {
    padding-top: 10px;
}
#page .two_ticket .ticket_block .question ul li {
    font-size: 12px;
    line-height: 22px;
    color: #333333;
}
#page .two_ticket .ticket_block .question ul li a {
    color: #3997DC;
    text-decoration: underline;
}
#page .two_ticket .ticket_block .question ul li ~ li {
    padding-top: 3px;
}


.n_pop_up ul li {
    font-size: 14px;
    font-weight: normal;
    line-height: 24px;
    margin: 0 0 5px 10px !important;
    word-wrap: break-word;
    list-style: disc;
}
.n_pop_up ul li:last-child {
    margin: 0 0 20px 10px !important;
}


/*
    ゲストトップにバナー追加
**/
.container .ticket {
    padding-top: 20px;
}

/*
    予約・講師検索
**/
 .area-search .search-special {
    width: 100%;
    box-sizing: border-box;
 }
.search-condition {
    width: 407px;
    line-height: 30px;
    position: relative;
    overflow: visible;
    float: left;
}
#tabs2 .search-condition {
    width: 100%;
    box-sizing: border-box;
}
.time-search .pull-left {
     height: 30px;
     line-height: 30px;
 }
.time-search .time_to {
     height: 30px;
     line-height: 30px;
 }
.choose_country {
    height: 30px;
    vertical-align: top;
    line-height: 15px;
    border-radius: 3px;
    padding: 0 10px;
    border: 1px solid #bbb6b4;
    background: #ffffff;
    margin-right: 4px;
}
#tabs2 .choose_country {
    margin-right: 4px;
}
.search-condition select {
    height: 30px;
    vertical-align: top;
    line-height: 15px;
    border-radius: 3px;
    padding: 0 10px;
    border: 1px solid #bbb6b4;
    background: #ffffff;
    margin-right: 4px;
 }
.search-condition select:last-child {
    margin-right: 0;
 }
.time-search select {
    height: 30px;
    width: 90px !important;
    vertical-align: top;
    line-height: 15px;
    border-radius: 3px;
    padding: 0 2px;
    border: 1px solid #bbb6b4;
    background: #ffffff;
    margin-right: 2px;
 }
.choose_country_display {
    display: none;
    position: absolute;
    width: 890px;
    height: 440px;
    padding: 20px;
    box-sizing: border-box;
    background: #FFFFFF;
    top: 50px;
    right: 10px;
    z-index: 100;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
}
.choose_country_display.active {
    z-index: 100;
    display: block;
}
.choose_country_display::after {
    content: '';
    width: 0;
    height: 0;
    border-bottom: 15px solid #FFFFFF;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    top: -15px;
    right: 228px;
}
#choose_country_display02 {
    right: -78px;
}
#choose_country_display02.choose_country_display::after {
    right: 653px;
}
.choose_country_display dl {
    width: 100%;
    height: 350px;
    border-left: 2px solid #F5EBE7;
    border-right: 2px solid #F5EBE7;
    border-bottom: 2px solid #F5EBE7;
    overflow-y: scroll;
    box-sizing: border-box;
}
.choose_country_display dl dt {
    position: relative;
    width: 100%;
    height: 32px;
    font-size: 15px;
    font-weight: bold;
    line-height: 32px;
    padding-left: 9px!important;
    background: #F5EBE7;
    box-sizing: border-box;
}
.choose_country_display dl dt:hover {
    cursor: pointer;
}
.choose_country_display dl dt input,.choose_country_display dl dd ul li input {
    width: 12px;
    height: 12px;
    border: 2px solid #9A9A9A!important;
    background: #FFFFFF!important;
    vertical-align: top;
    position: relative;
    top: 3px;
    margin: 0!important;
}
.choose_country_display dl dt input[type="checkbox"]:checked,.choose_country_display dl dd ul li input[type="checkbox"]:checked {
    overflow: hidden;
}
.choose_country_display dl dt input[type="checkbox"]:checked + label {
    position: absolute;
    bottom: 10px;
    left: 4px;
}
.choose_country_display dl dd ul li input[type="checkbox"]:checked + label {
    position: absolute;
    left: 2px;
}
.choose_country_display dl dt input[type="checkbox"]:checked + label::before,.choose_country_display dl dd ul li input[type="checkbox"]:checked + label::before {
    content: '';
    display: inline-block;
    width: 12px;
    height: 12px;
    vertical-align: bottom;
    position: relative;
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/list/checkbox_word.png') -11px 0 no-repeat;
    background-size: cover;
    bottom: 1px;
}
.choose_country_display dl dt input[type="checkbox"]:checked + label::before {
    left: 3px;
}
.choose_country_display dl dd ul li input[type="checkbox"]:checked + label::before {
    left: 0px;
}
.choose_country_display dl dt input {
    top: 9px;
}
.choose_country_display dl dt .text_adjust {
    padding-left: 5px;
}
.choose_country_display dl dd ul {
    padding: 12px 0 12px 6px!important;
}
.choose_country_display dl dd ul li {
    position: relative;
    display: inline-block;
    width: 200px;
    font-size: 12px;
    line-height: 16px;
    padding: 0 0 0 3px!important;
    margin: 9px 0 0 3px!important;
    box-sizing: border-box;
}
.choose_country_display dl dd ul li:hover {
    cursor: pointer;
}
.choose_country_display dl dd ul li.active {
    background: rgba(244,178,186,1)!important;
}
.choose_country_display dl dd ul li .text_adjust {
    display: inline-block;
    width: 175px;
    white-space: wrap;
    vertical-align: top;
    margin-left: 2px!important;
    padding-top: 1px;
}
.choose_country_display dl dd ul li:first-of-type,.choose_country_display dl dd ul li:nth-of-type(4n+1) {
    margin-left: 0!important;
}
.choose_country_display dl dd ul li:first-of-type,.choose_country_display dl dd ul li:nth-of-type(2),.choose_country_display dl dd ul li:nth-of-type(3),.choose_country_display dl dd ul li:nth-of-type(4) {
    margin-top: 0!important;
}
.choose_country_display .complete_country {
    text-align: center;
    padding-bottom: 20px;
}
.choose_country_display .complete_country a {
    display: inline-block;
    font-size: 12px;
    line-height: 12px;
    background-color: #2FA6F5;
    color: #FFFFFF!important;
    padding: 10px 20px;
    border-radius: 20px;
    margin-top: 20px;
}
#country_bg,#country_bg02 {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
    left: 0;
    top: 0;
}


/*
    Checkbox
**/
#page .search-keyword.clearfix02 {
    overflow: visible!important;
}
#page .search-keyword p.mt0 {
    margin-top: 0px!important;
}
#page .ui-tabs .search-keyword .display_native {
    padding: 0 0 0 8px!important;
    border: none!important;
}
#page .ui-tabs .search-keyword .display_native.clearfix02 {
    overflow: visible!important;
}
#page .ui-tabs .search-keyword .display_native li {
    display: inline-block;
}
#page .ui-tabs .search-keyword .display_native li ~ li {
    margin-left: 30px!important;
}
#page .ui-tabs .search-keyword .display_native li input {
    vertical-align: top;
    position: relative;
    top: 3px;
}
/*
       この教材に対応する講師を検索
**/
.search_box {
    width: 500px;
    font-size: 12px;
    line-height: 19px;
    color: #666666;
    padding: 15px;
    box-sizing: border-box;
    margin: 12px 0 0 240px;
    border-radius: 10px;
}
.search_box02 {
    width: 100%;
    font-size: 12px;
    line-height: 19px;
    color: #666666;
    padding: 15px;
    box-sizing: border-box;
    border-radius: 10px;
}
.search_box .search_btn,.search_box02 .search_btn {
    display: block;
    height: 40px;
    width: 290px;
    font-size: 14px;
    line-height: 40px;
    color: #FFFFFF!important;
    background: #FD7822;
    text-align: center;
    border-radius: 20px;
}
.search_box .search_tag,.search_box02 .search_tag {
    display: inline-block;
    border: 1px solid #BBB6B4;
    color: #666666;
    line-height: 12px;
    border-radius: 3px;
    padding: 4px 8px;
    margin: 0 5px 3px 0;
}
.search_box .search_tag img,.search_box02 .search_tag img {
    margin-right: 5px!important;
    vertical-align: bottom;
}
.material_blue {
    color: #1CABEE!important;
}
.material_list {
    font-size: 12px;
    line-height: 17px;
    color: #FF0000;
}
.material_list li {
    list-style-type: disc;
}
.material_list li ~ li {
    padding-top: 3px!important;
}
.material_buy {
    display: block;
    width: 140px;
    height: 30px;
    font-size: 12px;
    color: #333333!important;
    text-align: center;
    line-height: 26px;
    background: #F0F0F0;
    border: 1px solid #E1E1E1;
    box-sizing: border-box;
    border-radius: 20px;
}

/*
    Common
**/
.underline {
    text-decoration: underline;
}
.disc li {
    list-style-type: disc;
}
.otoshidama2016 {
    padding-bottom: 25px;
}
.bg_white {
    background: #FFFFFF;
}
.bg_gray {
    background: #F7F7F7;
}

/*
       ゲストトップにバナー追加
**/
.container .ticket {
    padding-top: 20px;
}

.native-info {
    margin-top: 15px;
    padding: 10px 15px;
    background: #FFFFFF;
    border: 2px solid #e30b17;
    font-size: 13px;
    line-height: 1.7;
}
.native-info p {
    display: inline-block;
    margin-bottom: 5px !important;
    font-size: 18px;
    font-weight: bold;
    color: #e30b17;
}
.native-info a {
    color: #187edc !important;
    text-decoration: underline!important;
}
.japanese-info {
    margin-top: 15px;
    padding: 10px 15px;
    background: #fff;
    border: 2px solid #55b301;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    line-height: 1.7;
    color: #55b301;
}

/*
    iKnow! リスト
 **/
.iknow_list {
    position: relative;
    margin-bottom: 5px!important;
}
.iknow_list li {
    position: relative;
    display: inline-block;
    list-style-type: none;
    text-align: right;
    font-size: 12px;
}
.iknow_list li:first-of-type {
    width: 159px;
    margin-left: 5px!important;
}
.iknow_list li::after {
    content: '';
    width: 25px;
    height: 26px;
    position: absolute;
    left: 0;
    top: -6px;
}
.iknow_list li:first-of-type::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/study_iknow01.png) no-repeat;
    background-size: 100% 100%;
    left: -4px;
}
.iknow_list li:nth-of-type(2) {
    width: 190px;
    margin-left: 35px!important;
}
.iknow_list li:nth-of-type(2)::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/add_iknow01.png) no-repeat;
    background-size: 100% 100%;
    left: 0;
}
.iknow_list li:nth-of-type(3) {
    width: 119px;
    margin-left: 30px!important;
}
.iknow_list li:nth-of-type(3)::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/play_audio01.png) no-repeat;
    background-size: 100% 100%;
    left: 0;
}
.iknow_list li:last-of-type {
    float: right;
    width: 166px;
}
.iknow_list li:last-of-type::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/dl_audio01.png) no-repeat;
    background-size: 100% 100%;
    left: 0px;
}
.iknow_list.only-iknow li {
    position: relative;
    display: inline-block;
    list-style-type: none;
    text-align: right;
    font-size: 12px;
}
.iknow_list.only-iknow li:first-of-type {
    width: 159px;
    margin-left: 5px!important;
}
.iknow_list.only-iknow li::after {
    content: '';
    width: 25px;
    height: 26px;
    position: absolute;
    left: 0;
    top: -6px;
}
.iknow_list.only-iknow li:first-of-type::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/study_iknow01.png) no-repeat;
    background-size: 100% 100%;
    left: -4px;
}
.iknow_list.only-iknow li:nth-of-type(2) {
    width: 190px;
    margin-left: 35px!important;
}
.iknow_list.only-iknow li:nth-of-type(2)::after {
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/material/add_iknow01.png) no-repeat;
    background-size: 100% 100%;
    left: 0;
}
.iknow_list.only-iknow li:last-of-type {
    float: none;
}

.top_line {
    vertical-align: top;
    font-size: 14px;
}
.material_attention {
    font-size: 10px;
    line-height: 10px;
    text-align: right;
    color: #adadad;
    margin-bottom: 5px!important;
}

.common_p .profile_pictures {
    width: 115px;
    position: relative;
    display: inline-block;
    padding: 7px 7px 10px!important;
    border-radius: 5px;
    border: 1px solid #DBDBDB;
    background: #FFFFFF;
}
.common_p .profile_pictures a {
    display: block;
}
.common_p .profile_pictures.new_teacher::after {
    content: '';
    position: absolute;
    width: 44px;
    height: 44px;
    top: 0;
    right: 0;
    background: url(http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/common/new_teacher.png) no-repeat;
    background-size: cover;
}
.common_p .profile_pictures .favorite {
    position: absolute;
    width: 22px;
    height: 20px;
    top: 9px;
    left: 9px;
    z-index: 20;
}
.common_p .profile_pictures img {
    width: 115px;
}
.common_p .profile_pictures .en_name,.profile_pictures .jp_name,.profile_pictures .from {
    text-align: center;
    color: #7a7a7a;
    font-size: 12px;
    line-height: 12px;
    text-align: center;
}
.common_p .profile_pictures .en_name {
    padding-top: 10px!important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.common_p .profile_pictures .jp_name {
    padding-top: 5px!important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.common_p .profile_pictures .from {
    padding-top: 10px!important;
    text-align: center;
}
.common_p .profile_pictures .from img {
    width: 15px;
    position: relative;
    top: 1px;
    vertical-align: top;
}
.common_p .profile_pictures .from .countryname {
    width: 100%;
    display: block;
    font-size: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.common_p .profile_pictures .stars {
    display: block;
    width: 100%;
    height: 15px;
    border-top: 1px solid #E0E0E0;
    padding-top: 8px!important;
    margin-top: 8px!important;
}
.common_p .profile_pictures .stars li {
    display: inline-block;
    vertical-align: top;
    width: 13px!important; /*add !important as temp fix in EIK-1014*/
    margin: 0px 2px !important;
}
.common_p .profile_pictures .stars li ~ li {
    padding-left: 1px!important;
}
.common_p .profile_pictures .stars li img {
    width: 100%;
    vertical-align: top;
}
.common_p .profile_pictures .stars li:last-of-type {
    width: auto;
    font-size: 12px;
    line-height: 12px;
    font-weight: bold;
    color: #FFC841;
    position: relative;
    top: 1px;
}
.common_p .profile_pictures .total {
    font-size: 10px;
    line-height: 10px;
    color: #707070;
    text-align: center;
    letter-spacing: 1px;
    padding-top: 5px!important;
}
.common_p .evalute {
    display: block;
    width: 130px;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    color: #FFFFFF!important;
    text-align: center;
    border-radius: 15px;
    background: #FF7900;
    margin-top: 15px;
}
.common_p .after_evalute {
    width: 130px;
}
.common_p .after_evalute dt {
    font-size: 14px;
    line-height: 20px;
    padding-top: 15px;
}
.common_p .after_evalute dt .name {
    display: inline-block;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: top;
    color: #2E2E2E;
}
.common_p .after_evalute dd ul {
    display: flex;
    display: -webkit-flex;
    justify-content: space-around;
    -webkit-justify-content: space-around;
    margin-top: 10px;
}
.common_p .after_evalute dd ul li {
    display: inline-block;
    list-style-type: none;
    width: 18px;
}
.common_p .after_evalute dd ul li img {
    width: 100%;
}
.common_p .after_evalute dd ul li ~ li {
    padding-left: 4px;
}
.common_p .after_evalute dd .comment {
    width: 100%;
    padding: 8px;
    font-size: 12px;
    line-height: 20px;
    color: #2E2E2E;
    background: #F1F1F1;
    box-sizing: border-box;
    border-radius: 5px;
    margin-top: 10px;
}
#guest_pick_up .stars {
    padding-bottom: 0!important;
}

#guest_pick_up .profile_pictures p {
    text-align: center!important;
    padding-right: 0!important;
}

/* Native Trial Ticket */

.btn-native-trial {
    background: #bfa374;
    border-bottom: 7px solid #a38c63;
    box-sizing: border-box;
    letter-spacing: 2px;
    font-size: 31px;
    height: 87px;
    line-height: 67px;
    padding: 9px 0 9px 20px;
    text-align: left;
    width: 100%;
}

.btn-native-trial_member {
    background: #bfa374;
    border-bottom: 7px solid #a38c63;
    box-sizing: border-box;
    letter-spacing: 2px;
    font-size: 28px;
    height: 87px;
    line-height: 67px;
    padding: 9px 0 9px 20px;
    text-align: left;
    width: 100%;
}

.btn-native-trial-wrap p {
    text-align: center;
    color: #bfa374;
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 4px;
}

.btn-native-trial_member .btn-native-trial-img {
    position: absolute;
    top: -25px;
    right: 30px;
    width: 120px;
    height: 105px;
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/plan/greta.png') no-repeat;
    background-size: 100% 100%;
}

.btn-native-trial-wrap p span {
    font-size: 28px;
}
.btn-native-trial-wrap p small {
    margin-left: 5px;
    font-size: 15px;
    font-weight: normal;
}

.btn-native-trial .btn-native-trial-img {
    position: absolute;
    top: -35px;
    right: 40px;
    width: 131px;
    height: 115px;
    background: url('http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/plan/greta.png') no-repeat;
    background-size: 100% 100%;
}

.btn-native-trial img, .btn-native-trial_member img {
    position: absolute;
    right: 30px;
    top: 26px;
}

/**
 ticket-bnr
**/
.ticket-bnr-section {
  width: 730px;
  margin: 0 auto;
}
.ticket-bnr-section a {
  display: block;
}
.ticket-bnr-section a:hover {
  opacity: 0.7;
}
.ticket-bnr-section a img {
  width: 100%;
}
.ticket-bnr-section p {
  font-size: 14px !important;
  line-height: 14px;
  text-align: center;
}
.ticket-bnr-section p .date-ticket {
  color: #000;
  font-weight: bold;
  letter-spacing: 0.5px;
}

.error-nickname, .error-skype, .error-birthday {
    display: none;
}

/* ↓↓↓ Add Speaking Test Contents For Lesson Note Page 2017/01/16 ↓↓↓ */
.contents_main.speaking_test > dl {
  box-sizing: border-box;
  border: 1px #E0E0E0 solid;
  border-radius: 10px;
  background-color: #fff;
  margin: 0 0 15px !important;
}

.contents_main.speaking_test > dl > dt {
  position: relative;
  box-sizing: border-box;
  padding: 17px 10px 16px 75px !important;
  border-bottom: 1px solid #E0E0E0;
  font-size: 22px;
  font-weight: bold;
  line-height: 24px;
}

.contents_main.speaking_test > dl > dt::after {
  position: absolute;
  top: 10px;
  left: 15px;
  width: 40px;
  height: 35px;
  content: '';
  background: url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/lesson/ico_test.png") no-repeat;
  background-size: cover;
}

.contents_main.speaking_test > dl > dd {
  word-break: break-all;
  font-size: 14px;
  line-height: 25px;
}

.contents_main.speaking_test > dl > dd dl dt {
  letter-spacing: 0.01em;
  color: #8b8a8a;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5em;
  padding: 16px 0 0 !important;
}

.contents_main.speaking_test > dl > dd:first-of-type {
  padding: 20px 20px 16px !important;
}

.contents_main.speaking_test > dl > dd:first-of-type dl dt {
  margin: 0 0 12px !important;
  padding: 0 !important;
}

.contents_main.speaking_test > dl > dd:first-of-type dl dt span.inner {
  font-weight: bold;
  letter-spacing: 0.03em;
  font-size: 24px;
  color: #2fa8f5;
  vertical-align: middle;
}

.contents_main.speaking_test > dl > dd:first-of-type dl dd ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.contents_main.speaking_test > dl > dd:first-of-type dl dd ul li {
  list-style-type: none;
  width: 78px;
  height: 20px;
  background-color: #F1F1F1;
  border: solid 2px #F1F1F1;
  box-sizing: border-box;
  line-height: 16px;
  text-align: left;
  position: relative;
  font-size: 12px;
  letter-spacing: 0;
  color: #808080;
}

@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
  .contents_main.speaking_test > dl > dd:first-of-type dl dd ul li {
    /* Chrome Hack */
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .contents_main.speaking_test > dl > dd:first-of-type dl dd ul li {
    /* Safari Hack */
  }
}

.contents_main.speaking_test > dl > dd:first-of-type dl dd ul li span {
  text-align: center;
  height: 16px;
  width: 37px;
  display: inline-block;
}

@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
  .contents_main.speaking_test > dl > dd:first-of-type dl dd ul li span {
    /* Chrome Hack */
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .contents_main.speaking_test > dl > dd:first-of-type dl dd ul li span {
    /* Safari Hack */
  }
}

.contents_main.speaking_test > dl > dd:first-of-type dl dd ul li span.inner {
  position: absolute;
  top: 0;
  right: 0;
  background-color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #000;
}

.contents_main.speaking_test > dl > dd:last-of-type {
  padding: 0;
}

.contents_main.speaking_test > dl > dd:last-of-type dl {
  width: 531px;
  margin: 0 auto !important;
}

.contents_main.speaking_test > dl > dd:last-of-type dl dt {
  display: inline-block;
  vertical-align: top;
  width: 92px;
}

.contents_main.speaking_test > dl > dd:last-of-type dl dd {
  display: inline-block;
  width: 429px;
  background-color: #f1f1f1;
  margin: 0 0 0 5px !important;
}

.contents_main.speaking_test > dl > dd:last-of-type dl dd ul {
  padding: 16px 18px 16px 21px !important;
}

.contents_main.speaking_test > dl > dd:last-of-type dl dd ul li {
  list-style-type: none;
}

.contents_main.speaking_test > dl > dd:last-of-type dl dd ul li span.inner {
  letter-spacing: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.57142857142857em;
  text-indent: -7px;
  padding-left: 1em;
  display: inline-block;
}

.contents_main.speaking_test > dl > dd:last-of-type dl dd ul li span.inner:before {
  display: inline-block;
  content: "-";
  margin-right: 7px;
}

.contents_main.speaking_test > dl > dd:last-of-type dl:first-of-type {
  margin-bottom: 16px !important;
}

.contents_main.speaking_test > dl > dd:last-of-type dl:last-of-type {
  margin-bottom: 22px !important;
}

#page #content div.area-lessonnote .speaking_test .area-memo .capt img {
  height: 43px;
  width: 36px;
}

/*To remove download button generated by audio tag in Chrome v56*/
audio::-internal-media-controls-download-button {
    display:none;
}

audio::-webkit-media-controls-enclosure {
    overflow:hidden;
}

audio::-webkit-media-controls-panel {
    width: calc(100% + 30px);
}

/* ↓↓ Add Skype Contact Request Button CSS 2017/02/13. ↓↓ */
.list-lesson .bx-bg {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.list-lesson .bx-bg:after {
  display: block;
  clear: both;
  content: " ";
}

.list-lesson .bx-l {
  float: none !important;
  width: 182px;
  padding: 19px 0 !important;
  -webkit-flex-basis: 182px;
  -ms-flex-preferred-size: 182px;
  flex-basis: 182px;
}

.list-lesson .bx-r {
  width: 546px;
  margin: 0 !important;
  -webkit-flex-basis: auto;
  -ms-flex-preferred-size: auto;
  flex-basis: auto;
}

.list-lesson .teachers_skype {
  display: inline-block;
  width: 131px;
  margin: 13px 0 0;
}

.list-lesson .teachers_skype dl {
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 5px !important;
  padding: 11px 7px 9px !important;
  letter-spacing: 0.02em;
  word-wrap: break-word;
  color: #fff;
  border-radius: 4px;
  background-color: #2ab1ea;
  font-size: 13px;
  font-weight: normal;
}

.list-lesson .teachers_skype dl dt {
  position: relative;
  margin: 0 0 9px !important;
  padding: 0 0 7px !important;
  text-indent: 15px;
  border-bottom: solid 1px #55c1ee;
}

.list-lesson .teachers_skype dl dt:before {
  position: absolute;
  display: block;
  width: 16px;
  height: 16px;
  content: " ";
  background-image: url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/skype_white.png");
  background-size: cover;
}

.list-lesson .teachers_skype dl dd {
  text-align: left;
}

.list-lesson .teachers_skype dl dd a {
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  opacity: 1;
}

.list-lesson .teachers_skype dl dd a.button {
  position: relative;
  display: block;
  width: 115px;
  padding: 5px 0 6px;
  text-align: center;
  text-indent: 13px;
  letter-spacing: 0.02em;
  color: #fff !important;
  border-radius: 13px;
  background-color: #0e5572;
  font-size: 11px;
}

.list-lesson .teachers_skype dl dd a:hover {
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  opacity: 0.75;
}

.list-lesson .teachers_skype dl dd a.add_address:before {
  position: absolute;
  top: 7px;
  left: 14px;
  display: block;
  width: 12px;
  height: 13px;
  content: " ";
  background-image: url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/addres_ico.png");
  background-size: cover;
}

.list-lesson .teachers_skype dl dd a.call {
  cursor: default;
  -webkit-transition: none;
  transition: none;
  pointer-events: none;
  opacity: 1;
  color: #34708a !important;
}

.list-lesson .teachers_skype dl dd a.call:before {
  position: absolute;
  top: 7px;
  left: 14px;
  display: block;
  width: 12px;
  height: 13px;
  content: " ";
  background-image: url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/call_ico_off.png");
  background-size: cover;
}

.list-lesson .teachers_skype dl dd a.call:hover {
  -webkit-transition: none;
  transition: none;
  opacity: 1;
}

.list-lesson .teachers_skype dl dd a.call.on {
  cursor: pointer;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  pointer-events: auto;
  opacity: 1;
  color: #fff !important;
}

.list-lesson .teachers_skype dl dd a.call.on:before {
  position: absolute;
  top: 7px;
  left: 14px;
  display: block;
  width: 12px;
  height: 13px;
  content: " ";
  background-image: url("http://image.eikaiwa.dmm.com/assets/p/general/eikaiwa/member/call_ico.png");
  background-size: cover;
}

.list-lesson .teachers_skype dl dd a.call.on:hover {
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  opacity: 0.75;
}

.list-lesson .teachers_skype dl dd:first-of-type {
  margin: 0 0 8px !important;
  line-height: 16px;
}

.list-lesson .teachers_skype dl dd:nth-of-type(2) {
  margin: 0 0 9px !important;
}

.list-lesson .teachers_skype p {
  white-space: nowrap;
  letter-spacing: 0;
  color: #808080;
  font-size: 10px;
}

.list-lesson .portrait {
  display: inline-block;
  margin: 0 !important;
}
/* ↑↑ Add Skype Contact Request Button CSS 2017/02/13 End. ↑↑ */
/*---------- compornent ----------*/
/*player*/
.c-player-container {
    display: none;
    background: #f7f7f7;
    line-height: 1;
}
.c-player-container a {
    text-decoration: none !important;
}
.c-player-container .player-progress {
    width: 100%;
    height: 10px;
    background: #e0e0e0;
    cursor: pointer;
}
.c-player-container .player-progress .jp-seek-bar {
    height: 100%;
    background: #b5b5b5;
}
.c-player-container .player-progress .jp-play-bar {
    height: 100%;
    background: #2fa8f5;
}
.c-player-container .player-row {
    padding: 0 10px;
}
.c-player-container .player-row:after {
    display: block;
    clear: both;
    content: '';
}
.c-player-container .player-row .player-col {
    float: left;
    margin-left: 5px;
    font-size: 12px;
    line-height: 40px;
}
.c-player-container .player-row .player-col.is-right {
    float: right;
}
.c-player-container .player-row .player-col:first-child {
    margin-left: 0;
}
.c-player-container .player-controls {
    vertical-align: middle;
}
.c-player-container .player-btn {
    transition: all 0.3s ease 0s;
}
.c-player-container .player-btn img {
    display: inline-block;
    margin: auto !important;
    padding: 2px;
    vertical-align: middle;
}
.c-player-container .player-btn:focus {
    outline: none;
}
.c-player-container .player-btn:hover {
    opacity: 0.7;
    -ms-filter: 'alpha(opacity=70)';
}
.c-player-container .player-volume-bar {
    display: inline-block;
    width: 40px;
    height: 5px;
    background: #343434;
    cursor: pointer;
}
.c-player-container .player-volume-bar .player-volume-value {
    height: 5px;
    background: #2fa8f5;
}
.c-player-container .player-list {
    display: none;
}
/* end */

/* Skype Operation Page Up Date 2017/04/03. */
#page.area-skype-guide #content nav ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#page.area-skype-guide #content nav ul li {
  width: 175px;
  height: 60px;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  opacity: 1;
  border-radius: 5px 5px 0 0;
  background-color: #b3b3b3;
}

#page.area-skype-guide #content nav ul li:hover {
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  opacity: 0.75;
}

#page.area-skype-guide #content nav ul li.on {
  height: 65px;
  background-color: #30bdff;
}

#page.area-skype-guide #content nav ul li a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

#page.area-skype-guide #content nav ul li a img {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -21px 0 0 -59px;
  width: 118px;
}

#page.area-skype-guide #content .sect-box {
  border-top: none !important;
  border-radius: 0 0 10px 10px !important;
  padding: 30px !important;
}

#page.area-skype-guide #content .sect-box > p {
  margin: 0 0 30px;
  letter-spacing: 0.03em;
  color: #333333;
  font-size: 12px;
  line-height: 1.33333333333333em;
}

#page.area-skype-guide #content .sect-box > .box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin: 0 0 30px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

#page.area-skype-guide #content .sect-box > .box .imgBox {
  width: 300px;
}

#page.area-skype-guide #content .sect-box > .box .imgBox img {
  width: 100%;
}

#page.area-skype-guide #content .sect-box > .box .txtBox {
  width: 350px;
}

#page.area-skype-guide #content .sect-box > .box .txtBox p {
  margin: 0 0 8px;
  letter-spacing: -0.04em;
  font-size: 13px;
  line-height: 1.69230769230769em;
}

#page.area-skype-guide #content .sect-box > .box .txtBox p.fontRed {
  margin: 0 0 20px;
  letter-spacing: -0.03em;
  color: #ff0000;
  font-size: 12px;
  line-height: 1.5em;
  margin: 0;
}

#page.area-skype-guide #content .sect-box > .box .txtBox ul li {
  margin-left: 1.2em;
  list-style-type: disc;
  text-indent: -0.5em;
  letter-spacing: 0.03em;
  color: #ff0000;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5em;
}

#page.area-skype-guide #content .sect-box #iconDes {
  background-color: #f0f4f8;
  width: 100%;
  padding: 20px 0;
  margin: 0 0 30px;
}

#page.area-skype-guide #content .sect-box #iconDes h2 {
  color: #808080;
  font-size: 18px;
  letter-spacing: -0.03em;
  text-align: center;
  margin: 0 0 15px;
}

#page.area-skype-guide #content .sect-box #iconDes > .imgBox {
  width: 400px;
  margin: 0 auto 12px;
}

#page.area-skype-guide #content .sect-box #iconDes > .imgBox img {
  width: 100%;
}

#page.area-skype-guide #content .sect-box #iconDes ul {
  width: 400px;
  margin: 0 auto 12px;
}

#page.area-skype-guide #content .sect-box #iconDes ul li {
  font-size: 13px;
  letter-spacing: -0.03em;
  line-height: 1.69230769230769em;
  font-weight: bold;
  padding-left: 1em;
  text-indent: -1em;
}

#page.area-skype-guide #content .sect-box #iconDes ul li span {
  font-weight: normal;
}

#page.area-skype-guide #content .sect-box #iconDes > p {
  font-size: 12px;
  letter-spacing: 0.02em;
  color: #808080;
  text-align: center;
}

#page.area-skype-guide #content .sect-box #transDes {
  background-color: #f0f4f8;
  width: 100%;
  padding: 22px 30px 28px;
  box-sizing: border-box;
}

#page.area-skype-guide #content .sect-box #transDes h2 {
  color: #808080;
  font-size: 18px;
  letter-spacing: -0.03em;
  text-align: center;
}

#page.area-skype-guide #content .sect-box #transDes h2 span {
  font-size: 12px;
  letter-spacing: 0.04em;
  font-weight: normal;
  margin: 0 0 0 6px;
}

#page.area-skype-guide #content .sect-box #transDes > p {
  font-size: 13px;
  letter-spacing: -0.03em;
  line-height: 1.69230769230769em;
  margin: 0 0 16px;
}

#page.area-skype-guide #content .sect-box #transDes > .box {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  margin: 0 0 25px;
}

#page.area-skype-guide #content .sect-box #transDes > .box:last-of-type {
  margin: 0;
}

#page.area-skype-guide #content .sect-box #transDes > .box .imgBox {
  width: 270px;
}

#page.area-skype-guide #content .sect-box #transDes > .box .imgBox img {
  width: 100%;
}

#page.area-skype-guide #content .sect-box #transDes > .box .txtBox {
  width: 317px;
}

#page.area-skype-guide #content .sect-box #transDes > .box .txtBox p {
  font-size: 13px;
  letter-spacing: -0.05em;
  line-height: 1.69230769230769em;
  margin: 0 0 2px;
}

#page.area-skype-guide #content .sect-box #transDes > .box .txtBox p.fontGray {
  font-size: 12px;
  color: #808080;
  letter-spacing: -0.06em;
  line-height: 1;
  margin: 0 0 12px;
}

#page.area-skype-guide #content .sect-box #transDes > .box .txtBox a {
  font-size: 12px;
  line-height: 0.07em;
  color: #4d4d4d;
  opacity: 1;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}

#page.area-skype-guide #content .sect-box #transDes > .box .txtBox a span {
  color: #a4a4a4;
  font-size: 10px;
  margin: 0 0 0 -2px;
  -webkit-transform: scale(0.65);
  -ms-transform: scale(0.65);
  transform: scale(0.65);
  display: inline-block;
}

#page.area-skype-guide #content .sect-box #transDes > .box .txtBox a:hover {
  opacity: 0.75;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
/* Skype Operation Page Up Date 2017/04/03 End. */

.remind_mail {
    border: solid 2px #ddd;
    border-radius: 12px;
    padding: 15px !important;
}

.remind_mail li select {
    vertical-align: middle;
}

.remind_mail li label input {
    vertical-align: baseline !important;
}

.remind_mail li {
    line-height: 2.5;
    text-align: center;
}

#form_withdrawing ol.choices-list {
    list-style: none !important;
}

.remind_mail_red {
    color: #c00;
}

.remind_mail_date_error {
    border: 1px solid red;
}

/* withdrawal_sus/** & left_nav/two_membership.html Added Suspension Contents CSS. 2017/06/19. */
#withdrawal_sus {
  width: 100%;
  padding: 17px 0 0 0;
}
#withdrawal_sus p {
  margin: 0 0 15px 0;
  letter-spacing: 0.05em;
  color: #333333;
  font-size: 14px;
}
#withdrawal_sus p:last-of-type {
  margin: 0 0 32px 0;
}
#withdrawal_sus #btn_box {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
#withdrawal_sus #btn_box a.btn {
  width: 310px;
  height: 40px;
  padding: 0;
  cursor: pointer;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  letter-spacing: 0.145em;
  opacity: 1;
  border: none;
  border-radius: 20px;
  font-size: 16px;
  font-weight: bold;
  line-height: 40px;
  text-align: center;
  color: #fff;
}
#withdrawal_sus #btn_box a:hover {
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  opacity: 0.6;
}
#withdrawal_sus #btn_box a:first-of-type {
  background-color: #ff7f00;
}
#withdrawal_sus #btn_box a:last-of-type {
  background-color: #ccc;
}
#withdrawal_sus a.go_top {
  letter-spacing: 0.05em;
  color: #333333;
  font-size: 14px;
  text-decoration: underline;
  display: inline-block;
  margin: 0 0 10px 0;
  opacity: 1;
  transition: opacity 0.5s;
}
#withdrawal_sus a.go_top:hover {
  opacity: 0.6;
  transition: opacity 0.5s;
}
#side-navi span.suspension {
  display: block;
  margin: 0 0 6px 0;
  color: #ff6e6e;
}
#side-navi a.btn_suspension {
  width: 100%;
  display: block;
  padding: 7px 0 8px 0;
  text-align: center;
  color: #fff;
  background: #fd8424;
  border-radius: 100px;
  font-size: 12px;
  font-weight: normal;
  line-height: 1;
  margin: 0 0 6px 0;
}
#side-navi a.btn_suspension:hover {
  text-decoration: none;
}

/* pc/member/teacher_list/index.html Added Favorite Teacher's Schedule Button 2017/07/12. */
.heading_wrap_favorite {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 12px 0 15px;
}
.heading_wrap_favorite h1 {
  margin: 0;
}
.btn_favorite {
  background-color: #FF8400;
  color: #fff !important;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  padding: 8px 20px;
  border-radius: 25px;
  opacity: 1;
  transition: opacity 0.5s;
}
.btn_favorite:hover {
  opacity: 0.8;
  transition: opacity 0.5s;
}
