@charset "utf-8";
/*--------------------------------------------------------

    global
    
    01. forPC Layout
    
    02. forSP Layout (SP + TABLET)

    03. forSP Layout (SP ONLY)

--------------------------------------------------------*/



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

    01. forPC Layout

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

body {
    min-width: 960px;
    color: #000;
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 14px;
    line-height: 1.5;
}
table {
    border-spacing: 0;
}
a {
    color: #000;
}
a:link {
    color: #000;
    text-decoration: none;
}
a:visited {
    color: #000;
    text-decoration: none;
}
a:hover, a:active {
    color: #000;
}
a img, a:link img, a:visited img, a:hover img, a:active img {
    border: medium none;
    text-decoration: none;
}
.csspie {
    position: relative;
}

/* header
   ========================================================================== */
#wrapper {
    background: #faf3df;
}
#header_wrap {
    height: 110px;
    padding: 0 0 10px;
    background: url("../img/common/header_flag@1.5x.png") repeat-x 0 2px #faf3df;
    background-size: auto 35px;
}

#header {
    width: 960px;
    margin: 0 auto;
}
#header .lc {
    margin: 50px 20px 0;
}
#header #hd_logo, #header #hd_logo {
    height: 54px;
    width: 180px;
}
nav {
    width: 750px;
    margin-left: 225px;
    padding: 52px 0 0;
}
nav ul li { float: left; width: 104px;}

nav ul li a.nv {
     width: 104px;
     height: 0;
     padding-top: 54px;
     overflow: hidden;
     display: block;
     background: url(../img/common/gnavi@1.5x.png?181101-0900) no-repeat;
     background-size: auto 108px;
    /*-webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;*/
    transition: none;
}
nav ul li a.nav:hover {
    /*-webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;*/
    transition: none;
}
li#m1 a.nv {background-position: 0 0;}
li#m2 a.nv {background-position: -104px 0;}
li#m3 a.nv {background-position: -208px 0;}
li#m4 a.nv {background-position: -312px 0;}
li#m5 a.nv {background-position: -416px 0;}
li#m6 a.nv {background-position: -520px 0;}
li#m7 a.nv {background-position: -624px 0;}

li#m1 a.nv:hover {background-position: 0 -54px;}
li#m2 a.nv:hover {background-position: -104px -54px;}
li#m3 a.nv:hover {background-position: -208px -54px;}
li#m4 a.nv:hover {background-position: -312px -54px;}
li#m5 a.nv:hover {background-position: -416px -54px;}
li#m6 a.nv:hover {background-position: -520px -54px;}
li#m7 a.nv:hover {background-position: -624px -54px;}

#to2020 li#m2 a.nv { background-position: -129px -38px;}
#curriculum li#m3 a.nv { background-position: -296px -38px;}
#topics li#m4 a.nv { background-position: -436px -38px;}
#materials li#m5 a.nv { background-position: -606px -38px;}

#hd_overlay{
    background: #fff;
    opacity: 0;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 100;
}
#sp-head {
    display: none;
}
#sp-navi {
    display: none;
}
/*
-- Level1 -------------------------  */
ul.hd_lv1 {
    position: relative;
    list-style:none;
    margin:0;
    padding:0;
    z-index:200;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

ul.hd_lv1>li {
    position: relative;
}

#m1 ul.hd_lv2, #m2 ul.hd_lv2, #m3 ul.hd_lv2, #m4 ul.hd_lv2 {
    display: none;
    position: absolute;
    /*top: 72px;*/
    left: -1px;
    width: 280px;
    color: #000;
    margin: 0;
    border-left: 1px solid #e8779a;

}
#m5 ul.hd_lv2 {
    display: none;
    position: absolute;
    /*top: 72px;*/
    right: 1px;
    width: 280px;
    color: #000;
    margin: 0;
    border-left: 1px solid #e8779a;
}
ul.hd_lv1 li:hover ul.hd_lv2 {
    display: block;
}
ul.hd_lv2 li {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 130%;
    /*float: left;*/
}
ul.hd_lv2 li:last-child {
    margin-right: 0;
}
ul.hd_lv2 li a{
    color: #fff;
    text-decoration: none;
    display: block;
    padding: 10px 24px;
    border-right: 1px solid #e8779a;
    border-bottom: 1px solid #e8779a;
    background: #fa7b9c;
    font-weight: bold;
}
ul.hd_lv2 li a:hover{
    background: #fa7b9c;
}
/* 追加171114 */
ul.hd_lv1 li li:last-child a{
    padding: 10px 10px;
}
ul.hd_lv2 li p{
    color: #e8779a;
    text-decoration: none;
    display: block;
    padding: 10px 6px;
    border-right: 1px solid #e8779a;
    border-bottom: 1px solid #e8779a;
    border-radius: 8px;
    background: #fff;
    font-weight: bold;
    font-size: 12px;
}
/* 追加ここまで*/

/*
-- Level3 -------------------------  */
ul.hd_lv3  {
    position:static;
    padding:0;
    width: auto;
    font-size:10px;
    margin-left:0px;
}
ul.hd_lv3 li {
    float: none;
    margin-bottom:1px;
    width: auto;
    margin-right:0px;
    margin-left:0px;

}
ul.hd_lv3 li a{
    color: #000;
    width: auto;
    background-color: #ffffff;
}

/*
-- Baloon -------------------------  */
li#m2 .bln, li#m3 .bln, li#m4 .bln, li#m5 .bln {
    position: absolute;
    top: -79px;
}
li#m2 .bln{ left: -90px;}
li#m3 .bln{ left: -58px;}
li#m4 .bln{ left: 22px;}
li#m5 .bln{ left: 96px;}


/* header 201912
   ========================================================================== */
#header_wrap.header_wrap_201911 {
    position: absolute;
    top: 0;
    z-index: 999;
    width: 100%;
    min-width: 960px;
    height: 90px;
}
.is-nav-fixed #header_wrap.header_wrap_201911 {
    position: fixed;
    box-shadow: 0 2px 3px rgba(0,0,0,.2);
}
.header_wrap_201911 #header {
    position: relative;
}
.header_wrap_201911 #header .lc {
    margin: 50px 0 0;
}
.header_wrap_201911 #header #hd_logo {
	float: left;
    width: 500px;
    background: url("../img/common/hd_logo_201911@1.5x.png") no-repeat 0 0;
    background-size: 476px auto;
    display: block;
    cursor: default;
}
.header_wrap_201911 #header #hd_logo a{
    display: block;
    height: 54px;
}
.header_wrap_201911 #header .hd_catch {
	float: left;
	margin: 15px 0 0 5px;
	font-size: 18px;
	color: #4d4d4d;
	letter-spacing: 1px;
}

.header_wrap_201911 header {
    position: relative;
    top: 100px;
    width: 960px;
    margin: 0 auto;
}
.drawer--top .header_wrap_201911 .drawer-hamburger, .drawer--top.drawer-open .header_wrap_201911 .drawer-hamburger {
    right: -54px;
    top: -55px;
    padding: 11px .85rem 23px;
    position: relative;
    background: #54a3c4;
}
.header_wrap_201911 .drawer-hamburger-icon, .header_wrap_201911 .drawer-hamburger-icon:after, .header_wrap_201911 .drawer-hamburger-icon:before {
    height: 3px;
    background-color: #fff;
}
.drawer--top.drawer-open .header_wrap_201911 .drawer-nav {
    position: absolute;
    z-index: 100;
    left: 335px;
    top: 0;
    padding: 0;
    width: 400px;
    max-height: none;
    background-color: #e8779a;
}
.header_wrap_201911 nav ul li {
    float: none;
    width: 100%;
    border-bottom: 1px solid #db6199;
    line-height: 1.1;
    text-align: center;
}
.header_wrap_201911 nav ul li.border-bold {
    border-bottom: 2px solid #d15682;
}
.header_wrap_201911 nav ul li a:link,
.header_wrap_201911 nav ul li a:visited {
    padding: 2px 0 0;
    width: 400px;
    height: 50px;
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    text-align: center;
}
.drawer .drawer-overlay {
    z-index: 10;
    top: 100px;
    background-color: rgba(84,163,196,.2);
}





/* footer
   ========================================================================== */
#footer {
    position: relative;
    margin: 0 auto;
    padding: 36px 0 36px;
    width: 960px;
}
#footer #fnav li a {
    position: absolute;
}
#footer #fnav li#tts a {
    top: 32px;
    background-image: url("../img/common/logo_ten.png");
    background-repeat: no-repeat;
    display: block;
    height: 25px;
    width: 108px;
}
#footer #fnav li#wts a {
    right: 0;
    top: 32px;
    background-image: url("../img/common/logo_tosho.png");
    background-repeat: no-repeat;
    display: block;
    height: 34px;
    width: 106px;
}
#footer #copyright {
    color: #666666;
    font-size: 86%;
    text-align: center;
}

#footer #gnav li#gnav_menu a {
    background: url("/spl/eigo/to2020/ayumi/img/common/head_btn_tosho.png") no-repeat center 9px;
    background-size: auto 34px;
}
#footer #gnav li#gnav_menu_ten a {
    background: url("/spl/eigo/to2020/ayumi/img/common/head_btn_enet.png") no-repeat center 14px;
    background-size: auto 26px;
}
#footer #gnav li#gnav a {
   background-size: auto 26px;
}

#footer .rc {
    position: absolute;
    z-index: 10;
    right: 0;
    top: 18px;
    height: 50px;
    width: 960px;
    border-radius: 5px;
    text-indent: -9999px;
}
#footer #gnav {
}
#footer #gnav li#gnav_menu_ten {
    float: left;
}
#footer #gnav li#gnav_menu {
    float: right;
}
#footer #gnav li a {
    display: block;
    height: 50px;
    width: 140px;
}

/* ページの 先頭へ */
.pageTop {
    display:none;
    position:relative;
    width:100%;
    min-width:960px;
    margin:0 auto;
}
.pageTop a {
    position:fixed;
    bottom:5px;
    right:5px;
    display:block;
    width:70px;
    height:70px;
    text-align:left;
    z-index:99;
}

.pageTop2 {
    /*display:none; 修正161227 */
    position:relative;
    width:100%;
    min-width:960px;
    margin:0 auto;
}
.pageTop2 a {
    position:fixed;
    bottom: 100px !important;
    right:5px;
    display:block;
    width:80px;
    height:80px;
    text-align:left;
    z-index:99;
}

#contents {
    color: #333333;
    /*padding: 0 0 15px;*/
    background: #f8f1e9;
}
#contents_inner {
    height: auto !important;
    min-height: 500px;
}
#sub_contents {
    float: left;
    width: 194px;
}

.first_text {
    margin-top: 0 !important;
}
.annotation {
    font-size: 86%;
    margin-top: 14px;
}
.hd_first {
    margin-top: 0 !important;
}
.align_l {
    text-align: left;
}
.align_r {
    text-align: right;
}
.align_c {
    text-align: center;
}
.caution_list {
    margin-top: 21px;
}
.caution_list li {
    font-size: 86%;
}
.note {
    font-size: 86%;
}
.font_b {
    font-weight: bold;
}
.img_left {
    float: left;
    margin-bottom: 10px;
    margin-right: 20px;
}
.img_right {
    float: right;
    margin-bottom: 10px;
    margin-left: 20px;
}
.sec_nav_content {
    padding-bottom: 10px;
}

.sec_internal_link {
    margin-top: 21px;
}

.sec_pagetop {
    margin-top: 21px;
}
.sec_pagetop p.pagetop {
    float: right;
    font-size: 86%;
}
#contents p.pagetop {
    margin-top: 0;
}
.box_radius_8rad {
    border-radius: 8px;
}
.box_radius_5rad {
    border-radius: 5px;
}
.box_radius_gry01 {
    background-color: #f7f7f7;
    border: 1px solid #cccccc;
    border-radius: 5px;
    padding: 12px;
}
.box_solid_gry01 {
    border: 1px solid #cccccc;
    padding: 12px;
}






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

    02. forSP Layout (SP)
    *横幅が667px以下の場合
    

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

@media screen and (min-width: 0px) and (max-width: 668px) {



/* ============================================================ setting */
html { height: 100%; }
body { min-width: 320px; line-height: 1.5; height: 100%; -webkit-text-size-adjust: none; color: #4a4a4a; background: #ffffff; font-size: 16px; font-family: sans-serif; }

a { color: #000; }
a:link,
a:visited { color: #000; text-decoration: none; }
a:hover,
a:active { color: #000; text-decoration: none; }

a img, a:link img, a:visited img, a:hover img, a:active img { border: none; text-decoration: none; }

ul { list-style: none; }

/* ============================== clearfix */
/* For modern browsers */
.clr:before,
.mc:before,
.ms:before,
.clr:after,
.mc:after,
.ms:after { content: ""; display: table; }

.clr:after,
.mc:after,
.ms:after { clear:both; }

.clr,
.mc,
.ms { zoom:1; }

/* hide text */
.hidetxt, .hd { text-indent: -9999px; overflow: hidden; }
.hidetxt a, .hd a { overflow: hidden; }

/* ============================== multi column */
.ms {  }
.ls { float: left; }
.rs { float: right; }

.mc {  }
.lc { float: left; }
.rc { float: right;}

.align_l { text-align: left !important; }
.align_r { text-align: right !important; }
.align_c { text-align: center !important; }

.ofz { overflow: hidden; zoom: 1; }

.indent { padding-left: 1em; text-indent: -1em; }

/* ============================================================ wrapper */


/* ============================================================ header */
#header_wrap {
    display: none;
}

#header {display: none;}

/* header 201912
   ========================================================================== */
#header_wrap.header_wrap_201911 {
    display: block;
    height: 46px;
    min-width: auto;
    background-size: auto 17px;
}
.header_wrap_201911 #header {display: block; width: 100%;}
.header_wrap_201911 #header .lc {
    margin: 30px 0 0 3%;
    width: 83%;
}
.header_wrap_201911 #header #hd_logo {
    height: 20px;
    width: 167px;
    background: url(../img/common/hd_logo_201911@1.5x.png) no-repeat 0 0;
    background-size: 167px auto;
    display: block;
    cursor: default;
}
.header_wrap_201911 header {
    top: 56px;
    width: 100%;
}
.header_wrap_201911 #header .hd_catch {
	display: none;
}
	.drawer--top .header_wrap_201911 .drawer-hamburger, .drawer--top.drawer-open .header_wrap_201911 .drawer-hamburger {
    right: 0;
    top: -35px;
    padding: 3px .75rem 14px;
    width: 1rem;
    position: relative;
    background: #54a3c4;
}
.header_wrap_201911 .drawer-hamburger-icon:before {
    top: -7px;
}
.header_wrap_201911 .drawer-hamburger-icon:after {
    top: 7px;
}
.drawer--top .header_wrap_201911 .drawer-nav {
    top: -120%;
}
.drawer--top.drawer-open .header_wrap_201911 .drawer-nav {
    position: absolute;
    z-index: 100;
    left: auto;
    right: 0;
    top: 0;
    padding: 0;
    width: 100%;
}
.header_wrap_201911 nav ul li {
    display: table;
}
.header_wrap_201911 nav ul li a:link, .header_wrap_201911 nav ul li a:visited {
    padding: 2px 0 0;
    width: 100%;
    height: 40px;
    font-size: 14px;
}

/* ============================================================ sp-head */
#sp-head .lc {
    margin: 16px 0 0 3%;
}
#sp-head #hd_logo, #header #hd_logo {
    height: 34px;
    width: 167px;
}
#sp-head #hd_logo {
    background: url("../img/common/hd_logo_sp@1.5x.png") no-repeat 0 10px;
    background-size: auto 15px;
    display: block;
    cursor: default;
}

/* --------------------------
    navigation
/* -------------------------- */

.avgrund-popin {
    width: 284px;
    position: fixed;
    top: 72%;
    left: 50%;
    margin-top: -190px;
    margin-left: -140px;
    z-index: 1000;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
}
#spn1 {
    font-size: 14px;
    letter-spacing: 2px;
    line-height: 90%;
    width: 284px;
    height: 46px;
    float: left;
    font-family: 'Montserrat', sans-serif;
}
#spn2 {
    font-size: 14px;
    letter-spacing: 2px;
    line-height: 90%;
    width: 284px;
    height: 46px;
    float: right;
    font-family: 'Montserrat', sans-serif;
}
#spn3, #spn5, #spn7 {
    font-size: 14px;
    letter-spacing: 2px;
    line-height: 90%;
    width: 284px;
    height: 46px;
    float: left;
    font-family: 'Montserrat', sans-serif;
}
#spn4, #spn6, #spn8 {
    font-size: 14px;
    letter-spacing: 2px;
    line-height: 90%;
    width: 284px;
    height: 46px;
    float: right;
    font-family: 'Montserrat', sans-serif;
}
#spn-lunch {
    font-size: 12px;
    letter-spacing: 2px;
    line-height: 120%;
    width: 284px;
    height: 56px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
}
#spn-lunch a {
    text-decoration: none;
    display: block;
    padding: 12px 16px 8px;
    background: #FAD050;
    color: #0F0C02;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}
#spn-lunch a span {
    font-size: 8px;
    letter-spacing: 1px;
}
.avgrund-popin li span {
    font-size: 10px;
    letter-spacing: 2px;
}
.avgrund-popin li:last-child {
    margin-bottom: 0;
}
#spnav a {
    text-decoration: none;
    display: block;
    padding: 14px 16px 14px;
    background: #fff;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    color: #fff;
}

#spn1 a {
    background: #e8779a;
}
#spn2 a {
    background: #e8779a;
}
#spn3 a {
    background: #e8779a;
}
#spn4 a {
    background: #e8779a;
}
#spn5 a {
    background: #e8779a;
}
#spn6 a {
    background: #e8779a;
}
#spn7 a {
    background: #e8779a;
}
#spn8 a {
    background: #A587E9;
}
#sp-logo {

    width: 160px;
    margin-left: -80px;
}
#sp-head {
    display: block;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998;
    background: url(../img/common/bg_header_wrap.jpg) repeat 0 40px;
    background-size: auto 80px;
}

#hawks {
    font-size: 10px;
    color: #fff;
    position: absolute;
    top: 17px;
    left: 190px;
}

#sp-head-in {
    padding: 20px 16px 4px;
    position: relative;
    background: url("../img/common/header_flag@1.5x.png") repeat-x 0 1px;
    background-size: auto 17px;
}
#sp-logo-sub {
    width: 80px;
}
#sp-logo img, #sp-logo-sub img {
    width: 100%;
    vertical-align: bottom;
}
.buttons {
    float: right;
    width: 40px;
}
.buttons img {
    width: 100%;
    vertical-align: bottom;
}
.download {
    width: 200px;
}
.button:hover {
    background: #74A599;
}
.button:active {
    background: #F6A953;
}
.socials {
    font-size: 12px;
    margin: 10px 0 20px;
}
.github-star-btn {
    width: 100px;
}
/* Custom styles for popin & close button */
.custom {
    color: #555;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.custom p {
    padding: 10px 20px;
    margin: 30px 0 0;
    font-size: 14px;
    font-weight: 300;
    text-align: justify;
}
.avgrund-close {
    display: block;
    text-transform: uppercase;
    color: #555;
    text-decoration: none;
    font-size: 13px;
}
.github, .twitter, .dribble {
    float: left;
    text-align: center;
    font-size: 12px;
    color: white;
    padding: 8px 18px;
    margin: 18px 0 0 20px;
    text-decoration: none;
    -webkit-transition: background 0.3s ease;
    -moz-transition: background 0.3s ease;
    -ms-transition: background 0.3s ease;
    -o-transition: background 0.3s ease;
    transition: background 0.3s ease;
}
.github {
    background: rgba(83, 83, 83, 0.8);
}
.github:hover {
    background: rgba(83, 83, 83, 1);
}
.twitter {
    background: rgba(71, 186, 255, 0.8);
}
.twitter:hover {
    background: rgba(71, 186, 255, 1);
}
.dribble {
    background: rgba(241, 118, 122, 0.8);
}
.dribble:hover {
    background: rgba(241, 118, 122, 1);
}
.avgrund-overlay {
    background: #54a3c4;
    width: 100%;
    position: relative;
    top: -20000px;
    left: 0;
    z-index: 101;
    visibility: hidden;
    opacity: 0;
    filter: alpha(opacity=0);
    text-align: center;
}
body.avgrund-ready, .avgrund-ready .avgrund-popin, .avgrund-ready .avgrund-overlay {
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: 0.3s all ease-out;
    -moz-transition: 0.3s all ease-out;
    -ms-transition: 0.3s all ease-out;
    -o-transition: 0.3s all ease-out;
    transition: 0.3s all ease-out;
}
body.avgrund-active {
/*-webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
    overflow: hidden;*/
}
.avgrund-active .avgrund-popin {
    visibility: visible;
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1.0);
    -moz-transform: scale(1.0);
    -ms-transform: scale(1.0);
    -o-transform: scale(1.0);
    transform: scale(1.0);
    text-align: center;
}
.avgrund-active .avgrund-overlay {
    visibility: visible;
    opacity: 0.8;
    filter: alpha(opacity=80);
    height: 40000px;
    z-index: 999;
}
.avgrund-popin.stack {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}
.avgrund-active .avgrund-popin.stack {
    -webkit-transform: scale(1.0);
    -moz-transform: scale(1.0);
    -ms-transform: scale(1.0);
    -o-transform: scale(1.0);
    transform: scale(1.0);
}
.avgrund-active .avgrund-blur {
    -webkit-filter: blur(1px);
    -moz-filter: blur(1px);
    -ms-filter: blur(1px);
    -o-filter: blur(1px);
    filter: blur(1px);
}
/* Optional close button styles */
#navclose {
    position: fixed;
    top: -26px;
    z-index: 9999;
    right: 0;
}
a.avgrund-close {
    background: url(../img/common/btn_close.png) no-repeat;
    width: 19px;
    height: 19px;
    text-indent: -9999px;
    background-size: cover;
    display: block;
}
#indexmain {
    width: 100%;
    margin-bottom: 24px;
    margin-top: 55px;
}
.slider > .bx-wrapper {
    margin-bottom: 1px;
}
.bx-wrapper img {
    width: 100%;
    vertical-align: bottom;
}
#PrevIcon, #NextIcon {
    display: none;
}
#imside {
    /*padding: 16px;*/
    margin-top: 1px;
}
#bn-premium {
    float: left;
    width: 54.3%;

}
.bn-p {
    margin-right: 1px;
}
#bn-index-small {
    float: right;
    width: 45.7%;
}
#bn-index-small li {
    margin-bottom: 1px;
}
#bn-index-small li:last-child {
    margin-bottom: 0;
}
#bn-premium img, #bn-index-small img {
    width: 100%;
    vertical-align: bottom;
}

#sp-navi {
    margin-bottom: 16px;
    text-align: center;
    width: 100%;
    display: table;
    padding-bottom: 15px;
    border-bottom: 1px solid #e6e6e6;
}
#sp-navi li {
    display: table-cell;
    height: 30px;
    line-height: 30px;
    font-size: 8px;
    letter-spacing: 1px;
    text-align: center;
    margin-bottom: 8px;
    border-right: 8px solid #F8F7E9;
    
}
#sp-navi li:last-child {
    border-right: none;
}
#sp-navi li a {
    background: #008DDC;
    color: #fff;
    display: block;
    text-decoration: none;
    padding: 0 8px;
    height: 29px;
    line-height: 30px;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    font-weight: bold;
}


/* ============================================================ contents */
#contents .brown{ color:#902000; font-size:129%; font-weight:bold;}
#contents .font-b{ font-weight:bold;}

/* ============================================================ main_contents */
#main_contents > h1 { padding-top: 6px; padding-bottom: 6px; background-color: #dc884c; color: #ffffff; text-align: center; border-bottom: #a42607 1px solid; }
#main_contents h2 ,
#main_contents #sec_campaign h2 { background-color: #efe0cb; padding: 7px 10px; font-weight: bold; color: #993300;
-webkit-border-radius: 5px;
border-radius: 5px;
}

/* ============================================================ footer */
#footer { margin-top: 5px;}

#contents_inner {
    margin-top: 0;
    width: 100%;
}

#footer {
    padding: 0;
    width: 100%;
    line-height: 1;
}

/* copyright */
#footer #copyright { padding-top: 10px; padding-bottom: 15px; color: #7f7f7f; text-align: center; font-size: 10px; }

#footer #gnav li#gnav_menu a {
    background: url("/spl/eigo/to2020/ayumi/img/common/head_btn_tosho.png") no-repeat center 9px;
    background-size: auto 22px;
}
#footer #gnav li#gnav_menu_ten a {
    background: url("/spl/eigo/to2020/ayumi/img/common/head_btn_enet.png") no-repeat center 14px;
    background-size: auto 16px;
}
#footer #gnav li#gnav a {
   background-size: auto 16px;
}

#footer .rc {
    right: 50%;
    top: 24px;
    width: 280px;
    margin: 0 -140px;
}
#footer #gnav {
}
#footer #gnav li {
    float: left;
}
#footer #gnav li a {
    display: block;
    height: 50px;
    width: 140px;
}

/* ページの 先頭へ */
.pageTop,
.pageTop2 {
    min-width:0;
}
.pageTop a,
.pageTop2 a {
    right: 3%;
    width:40px;
    height:40px;
}
.pageTop2 a {
    bottom: 65px !important;
}
.pageTop a img,
.pageTop2 a img{
    right: 3%;
    width:40px;
    height:40px;
}

/* ============================================================ heading */


/* ============================================================ module */

/* copyright */
#main_contents .copyright { font-size: 12px; }

#hd_nav { z-index:100; }
#lower a:link, #lower a:visited{ text-decoration:underline; }

#g_nav{ width:100%; }
#g_nav ul { display: table; width: 100%; overflow:hidden;}
#g_nav ul li { display: table-cell; vertical-align: middle; overflow:hidden; width:33%;}
#g_nav ul li a { display: block; width: 100%;}
#g_nav ul li img{ width: 100%; }

	
	
	

}





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

    03. forSP Layout (SP ONLY)
    *横幅が667px未満の場合
    

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

@media screen and (min-width: 0px) and (max-width: 667px) {

/* ページの 先頭へ */
.pageTop2 {
    display: none !important;
}


}