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

/* ===============================================
 headerArea（ヘッダーエリア）
=============================================== */
/* headerArea（MV部分）------------------*/
#headerArea {
    background: linear-gradient(0, rgba(255, 241, 71, 1), rgba(255, 241, 71, 0) 50%),url(/cmn/img/kanto/student/2017/index/header_bg.jpg);
    background-repeat: no-repeat, repeat;
    background-position: 100% 100%, 0 0;
    background-size: 100% 100%, 30px;
    margin: 0;
}

/* leadArea（リード文部分）------------------*/
#headerArea .leadArea span {
    display: block;
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
    text-align: center;
}



/* ===============================================
 lNav（ローカルナビエリア）
=============================================== */
#lNav .tab {
    clear: both;
    overflow: hidden;
    padding: 0 3.1%;
}
#lNav .tab > li {
    float: left;
    width: 32%;
    cursor: pointer;
    position: relative;
}
#lNav .tab > li+li {
    margin-left: 2%;
}
#lNav .tab > li.current:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    z-index: 1;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

/* .tab.top（上部ナビ）------------------*/
#lNav .tab.top {
    background-color: #FFF147;
}
#lNav .tab.top > li {
    padding-bottom: 1.5rem;
}
#lNav .tab.top > li.current:after {
    top: 0;
    background-position: 0 0;
}
#lNav .tab.top > li:first-child.current:after {
    background-image: url("/cmn/img/kanto/student/2017/beginners/nav_001_hd_act.png");
}
#lNav .tab.top > li:nth-child(2).current:after {
    background-image: url("/cmn/img/kanto/student/2017/beginners/nav_002_hd_act.png");
}
#lNav .tab.top > li:last-child.current:after {
    background-image: url("/cmn/img/kanto/student/2017/beginners/nav_003_hd_act.png");
}

/* .tab.bottom（下部ナビ）------------------*/
#lNav .tab.bottom > li {
    padding-top: 1.5rem;
}
#lNav .tab.bottom > li.current:after {
    bottom: 0;
    background-position: 0 100%;
}
#lNav .tab.bottom > li:first-child.current:after {
    background-image: url("/cmn/img/kanto/student/2017/beginners/nav_001_ft_act.png");
}
#lNav .tab.bottom > li:nth-child(2).current:after {
    background-image: url("/cmn/img/kanto/student/2017/beginners/nav_002_ft_act.png");
}
#lNav .tab.bottom > li:last-child.current:after {
    background-image: url("/cmn/img/kanto/student/2017/beginners/nav_003_ft_act.png");
}



/* ===============================================
 mainArea（メインエリア）
=============================================== */
/* mainArea（背景）------------------*/
#mainArea section {
    background-position: 0 0;
    background-repeat: repeat;
    background-size: 20px;
    padding: 50px 3.1% 3rem;
    margin: 0;
}

/* .phArea（画像）------------------*/
.phArea {
    padding: 2rem 0;
}
.phArea:first-child {
    padding-top: 1rem;
}

/* .descText（テキスト）------------------*/
.descText {
    padding-bottom:  1rem;
}
.descText+.descText {
    padding: 0 3.1% 1rem;
}
.attenText {
    display:  block;
    color: #F00;
    font-weight:  bold;
}

/* .descText（色テキスト）------------------*/
.bluText {
    color: #013D97;
    font-size: 130%;
    font-weight: bold;
}

/* linkArea.btn（ボタン）------------------*/
.linkArea.btn {
    background-color: #FF6600;
}

/* modalList（モーダルウィンドウ/ボタン）------------------*/
.linkArea.btn.modalList.btns .linkText {
    padding: 12px 20px 12px 0;
    font-weight: bold;
    font-size: 1.5rem;
    color: #FFF;
}

/* .textLink（テキストリンク）------------------*/
.textLink {
    text-align: right;
    padding-bottom: 0.5rem;
}
.textLink a {
    color: #E30052;
    font-weight: bold;
}
.textLink a span {
    display: inline-block;
    padding: 0 2rem 0 0;
    background-image: url("/cmn/img/kanto/icon/instruction/arrow_right_gray001.png");
    background-position: 112% 50%;
    background-repeat: no-repeat;
    background-size: auto 90%;
}
#resArea .descText+.descText span.textLink {
    font-size: 100%;
    margin: 0;
    padding: 0.5rem 0 0;
}
#resArea .descText+.descText span.textLink a span {
    background-position: 115% 50%;
    font-size: 100%;
    margin: 0;
    display: inline-block;
}
#resArea .descText+.descText+.linkArea.btn {
    margin-top: 6%;
}



/* ===============================================
 queArea（Questionエリア）
=============================================== */
/* queArea（背景）------------------*/
#mainArea #queArea {
    background-image: url("/cmn/img/kanto/student/2017/beginners/que_bg_001.png");
}

/* .queList > li（Questionリスト）------------------*/
.queList > li {
    border: solid 3px #000;
    background-color: #FFF;
}
.queList > li .titleArea.phTitle {
    margin: 0;
    padding: 2%;
    width: auto;
    border-bottom: dashed 2px #000;
}
.queList > li .cntsBox {
    padding: 3.1%;
}
.queList > li+li {
    margin-top: 1.5rem;
}
.queList > li .ansText {
    background-color: #FFFCC9;
    padding: 1.2rem 3.1% 1.2rem 40px;
    background-image: url("/cmn/img/kanto/student/2017/beginners/que_ans_icon.png");
    background-position: 10px 50%;
    background-repeat: no-repeat;
    background-size: 20px auto;
}
.queList > li .ansText+.descText {
    margin: 1.5rem 3.1% 0;
    padding: 0;
}
.descText .bluText {
    display: block;
    margin-bottom: 0.5rem;
}

/* accordion（アコーディオン）------------------*/
.accordion .tabArea {
    background-image: url("/cmn/img/kanto/student/2017/beginners/arrow_down_blu001.png");
    background-repeat: no-repeat;
    background-position: 97% 50%;
    background-size: 13px auto;
    cursor: pointer;
    background-color: #FFFCC9;
    font-weight: bold;
    padding: 1.5rem 32px 1.5rem 40px;
    position: relative;
}
.accordion .tabArea:before {
    content: "";
    position: absolute;
    width: 40px;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("/cmn/img/kanto/student/2017/beginners/que_ans_icon.png");
    background-position: 65% 47%;
    background-repeat: no-repeat;
    background-size: 45%;
}
.accordion .tabArea.open {
    background-image: url("/cmn/img/kanto/student/2017/beginners/arrow_up_biu001.png");
}
.accordion .descArea {
    display: none;
}
.accordion li+li {
	margin-top: 1rem;
}

/* voiceList（ボイスリスト）------------------*/
.voiceList > li {
    margin-top: 1rem;
    border-bottom: dotted 1px #000;
    position: relative;
    min-height: 7rem;
}
.voiceList > li:before {
    position: absolute;
    content: "";
    height: 5rem;
    width: 5rem;
    top: 0;
    left: 0.5rem;
    background-image: url("/cmn/img/kanto/student/2017/beginners/que_hmn_icon.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: cover;
}
.voiceList > li .descText {
    padding-left: 6.5rem;
}



/* ===============================================
 resArea（解決エリア）
=============================================== */
/* resArea（背景）------------------*/
#mainArea #resArea {
    background-image: url("/cmn/img/kanto/student/2017/beginners/res_bg_001.png");
}

/* .resList > li（解決リスト）------------------*/
.resList > li {
    border: solid #FFF147 3px;
    background-color: #FFF;
    background-image: url("/cmn/img/kanto/student/2017/beginners/res_bg_002.png");
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: 60% auto;
}

.resList > li+li {
    margin-top: 1.5rem;
}
.resList > li .cntsBox {
    padding: 3.1%;
}
.resList > li .titleArea.textTitle {
    width: auto;
    margin: 0;
    font-size: 1.4rem;
    font-weight: bold;
    background-color: #FFF147;
    padding: 0 5px 0 8rem;
    position: relative;
}
.resList > li .titleArea.textTitle span {
    vertical-align: middle;
    display: table-cell;
    height: 6rem;
}
.resList > li .titleArea.textTitle:before {
    content: "";
    position: absolute;
    width: 40%;
    height: 8rem;
    top: -10px;
    left: -10px;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.resList > li .titleArea.textTitle.trblIcon:before {
    background-image: url("/cmn/img/kanto/student/2017/beginners/res_trbl_icon.png");
}
.resList > li .titleArea.textTitle.anxIcon:before {
    background-image: url("/cmn/img/kanto/student/2017/beginners/res_anx_icon.png");
}
.resList > li .descText .bluText {
    font-size: 120%;
}
.resList > li .linkArea.btn {
    margin-top: 3%;
}
#resArea .descText+.descText {
    background-color: #FFFCC9;
    padding: 1.3rem;
}
#resArea .descText+.descText span {
    display: block;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 0.5rem;
}



/* ===============================================
 impArea（添乗員同行ツアーエリア）
=============================================== */
/* impArea（背景）------------------*/
#mainArea #impArea {
    background-image: url("/cmn/img/kanto/student/2017/beginners/imp_bg_001.png");
}

/* descText（上部テキスト）------------------*/
#impArea > .descText {
    padding-bottom: 1.5rem;
}

/* .impList > li（impリスト）------------------*/
.impList > li {
    border: solid #FFCB00 3px;
    background-color: #FFF;
}
.impList > li+li {
    margin-top: 1.5rem;
}
.impList > li .titleArea.textTitle {
    width: auto;
    margin: 0;
    background-color: #FFCB00;
    font-size: 1.5rem;
    font-weight: bold;
    padding: 1rem 5px 1rem 73px;
    position: relative;
}
.impList > li .titleArea.textTitle:before {
    content: "";
    position: absolute;
    width: 60px;
    height: 60px;
    top: -10px;
    left: 5px;
    background-image: url("/cmn/img/kanto/student/2017/beginners/imp_true_icon.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 100% auto;
}
.impList > li .cntsBox {
    padding: 17px 6% 0.3rem;
}