@charset "UTF-8";

@import "layout.css";

#all{
	background-size:1px 100px;
}
#smart_start #all{
	background-image:url(../../listening/common/img/bg_voice.svg);
}
/* h3{
	margin-top:-420px !important;
	padding-top:420px !important;
}
.reading_01 h3{
	margin-top:-450px !important;
	padding-top:450px !important;
}
.listening_practical h3{
	margin-top:-450px !important;
	padding-top:450px !important;
} */
.flex{
	display: flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
}
@media screen and (max-width:839px) {
	/* .reading_01 h3{
		margin-top:-95vh !important;
		padding-top:95vh !important;
	}
	.listening_01 h3{
		margin-top:-67vh !important;
		padding-top:67vh !important;
	}
	.listening_02 h3{
		margin-top:-67vh !important;
		padding-top:67vh !important;
	}
	.listening_03 h3{
		margin-top:-67vh !important;
		padding-top:67vh !important;
	}
	.listening_04 h3{
		margin-top:-60vh !important;
		padding-top:60vh !important;
	}
	.listening_practical h3{
		margin-top:-108vh !important;
		padding-top:108vh !important;
	} */
}
@media screen and (max-width:320px) {
	/* .reading_01 h3{
		margin-top:-90vh !important;
		padding-top:90vh !important;
	}
	.listening_01 h3{
		margin-top:-70vh !important;
		padding-top:70vh !important;
	}
	.listening_02 h3{
		margin-top:-70vh !important;
		padding-top:70vh !important;
	}
	.listening_03 h3{
		margin-top:-70vh !important;
		padding-top:70vh !important;
	}
	.listening_04 h3{
		margin-top:-65vh !important;
		padding-top:65vh !important;
	}
	.listening_practical h3{
		margin-top:-108vh !important;
		padding-top:108vh !important;
	} */
}

/* chrome opera */
@media screen and (max-width:839px) and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
	/* .reading_01 h3{
		margin-top:-70vh !important;
		padding-top:70vh !important;
	}
	.listening_01 h3{
		margin-top:-54vh !important;
		padding-top:54vh !important;
	}
	.listening_02 h3{
		margin-top:-54vh !important;
		padding-top:54vh !important;
	}
	.listening_03 h3{
		margin-top:-54vh !important;
		padding-top:54vh !important;
	}
	.listening_04 h3{
		margin-top:-54vh !important;
		padding-top:54vh !important;
	}
	.listening_practical h3{
		margin-top:-88vh !important;
		padding-top:88vh !important;
	} */
}
/* Firefox */
@media screen and (max-width:839px) {
@-moz-document url-prefix() {
	/* .reading_01 h3{
		margin-top:-67vh !important;
		padding-top:67vh !important;
	}
	.listening_01 h3{
		margin-top:-86vh !important;
		padding-top:86vh !important;
	}
	.listening_02 h3{
		margin-top:-52vh !important;
		padding-top:52vh !important;
	}
	.listening_03 h3{
		margin-top:-52vh !important;
		padding-top:52vh !important;
	}
	.listening_04 h3{
		margin-top:-52vh !important;
		padding-top:52vh !important;
	}
	.listening_practical h3{
		margin-top:-52vh !important;
		padding-top:52vh !important;
	} */
}
}
/*-------------------------------------------------------------------------
	Header
/*-----------------------------------------------------------------------*/
#header{
	position:fixed;
	background-color:#fff;
	width: 100%;
	z-index: 9;
}
	#header .header_wrap{
		width:100%;
		background:url(../img/bg_main_pc.jpg) no-repeat ;
		background-position: 0 -60px;
		background-size: 75%;
		padding: 0 0 123px 0;
		z-index: 99;
	}
	.third_edition #header .header_wrap{
		padding: 0 0 115.5px 0;
	}
	#header h1{
		width:76px;
		padding:20px 40px;
	}
@media screen and (max-width:839px) {
	#header{
		position:static;
	}
	#header .header_wrap{
		width:100%;
		background:url(../img/bg_main_sp.jpg) no-repeat;
		background-size:63%;
		background-position: 0 -7vw;
		position:static;
		padding: 0 0 5% 0;
	}
	.third_edition #header .header_wrap{
		padding: 0 0 2% 0;
	}
		#header h1{
			padding:4vw 4vw;
		}
}
/*-------------------------------------------------------------------------
	Contents
/*-----------------------------------------------------------------------*/
#contents {
	text-align: center;
}
	#contents h2 {
		font-size:14px;
		color:#ff3300;
		display:inline;
		float:left;
		margin-top:30px;
		margin-bottom:35px;
	}
		#contents h2 span {
			font-size:24px;
			font-weight:bold;
			margin-right:5px;
		}
@media screen and (max-width:839px) {
	#contents .wrap {

	}
		#contents .wrap .box {
			position:relative;
		}
}


/*-------------------------------------------------------------------------
	Fix
/*-----------------------------------------------------------------------*/
.fix {
	z-index:999;
	position: -webkit-sticky; /* safari対応 */
	position: sticky;
	top: 60px;　/* 上端から10pxのところで固定 */
}
@media screen and (max-width:839px) {
	.fix {
		top: 0px;
	}
}


/*-------------------------------------------------------------------------
	Title
/*-----------------------------------------------------------------------*/
.title_wrap{
	width: 940px;
	margin: 0 auto;
	position:relative;
}
.title_wrap .{
	width: 940px;
	margin: 0 auto;
	position:relative;
}
.title{
	width:50%;
	height: 140px;
	border:4px solid #000;
	border-radius:5px;
	background-color:#fff;
	text-align: center;
	padding:1% 0;
}
.title .title01{
	font-size:1.0rem;
}
.title .title02{
	font-size:1.0rem;
	font-weight:bold;
}
.title .sub_title{
	border-bottom:1px solid #c2c2c2;
    margin: 0 5% 2%;
    padding: 0 0 2% 0;
	font-size: 25px;
	line-height: 29px;
	font-weight: 600;
}
.title .sub_title span{
	font-size: 85%;
	color: #f21B00;
}
.reading_01 .title .sub_title{
	border-bottom:1px solid #c2c2c2;
    margin: 0 5% 0 28%;
    padding: 0 0 1% 0;
	font-size: 20px;
	font-weight: 600;
}
.partone {
	line-height: 4rem;
}
.title .year{
	font-size:3rem;
	font-weight:800;
}
.title .year .roboto{
	font-size:4.5rem;
	margin:0 1rem ;
	color: #f21B00;
	vertical-align: -5%;
}
.title_text{
	text-shadow:1px 1px 0px #fff;
	text-align: right;
	width: 500px;
	margin-top: 0.5rem;
}

@media screen and (max-width:839px) {
	.title_wrap{
		width: 100%;
	}
	.title{
		width:80%;
		height: 24vw;
		border: 1vw solid #000;
		border-radius: 1vw;
		margin:0 auto;
		float:none;
	}
	.title .title01{
		font-size:2vw;
	}
	.title .title02{
		font-size:2vw;
		font-weight:bold;
	}
	.title .sub_title{
		font-size:3.4vw;
		border-bottom:1px solid #c2c2c2;
	    margin: 0 2vw 1vw;
	    padding: 1vw 0 1vw 0;
		line-height: 6vw;
	}
	.title .sub_title br{
		display: none;
	}
	.title .sub_title span{
		padding-right: 2vw;
	}
	.reading_01 .title .sub_title{
		font-size:4.5vw;
		border-bottom:1px solid #c2c2c2;
	    margin: 0 5%;
	    padding: 0 0 1% 0;
	}
	.title .year{
		font-size:9vw;
		padding: 1vw 0 0 0;
	}
	.title .year .roboto{
		font-size:15vw;
		margin:0 0.5rem ;
		vertical-align: -1vw;
	}
	.title_text{
		text-align:center;
		margin:0.5rem 0 1rem;
		width:auto;
	}
	.partone {
		line-height: 14vw;
	}
}
/*-------------------------------------------------------------------------
	Menu
/*-----------------------------------------------------------------------*/
#menu {
    float:right;
    margin:10px 0px 40px;
}

    #menu h3 {
        display:none;
    }

    #menu li {
        float:left;
        margin-right:10px;
    }

        #menu li a {
            background:url(../../img/common/icon/arrow_normal.png) no-repeat left center;
            padding-left:20px;
            font-size:14px;
            color:#acacac;
        }

        #menu li.home a {
            background-image:url(../../img/common/icon/arrow_top.png);
            color:#ffaf3d;
        }

		#menu li a:hover,
		#menu li a.current {
			background-image:url(../../img/common/icon/arrow_active.png);
			color:#ff4f23;
		}

@media screen and (max-width:839px) {

    #menu h3 {
        display:block;
        background:url(../../img/common/menu.png) no-repeat left top;
        text-indent:-9999px;
        height:22px;
        width:47px;
        cursor:pointer;
    }

    #menu ul {
        display:none;
        background:#f02800;
        position:absolute;
        top:40px;
        right:0;
        z-index:9999;
    }

        #menu li {
			float:none;
			margin-right:0;
        }

            #menu li a {
				display:block;
				padding:10px 20px;
				 border-bottom:1px solid #fff;
				background:none;
                font-size:14px;
                color:#fff;
				text-align:center;
            }

			#menu li.home a {
				background:none;
				color:#ffaf3d;
			}

			#menu li a:hover,
			#menu li a.current {
				background:none;
				color:#fff;
			}

}


/*-------------------------------------------------------------------------
	Audio Player
/*-----------------------------------------------------------------------*/
#audioPlayer {
    position:relative;
    width:37.2%;
    margin-bottom:30px;
    background:#fff;
    float:right;
}
	#audioPlayer img{
	    width:100%;
	}

	#audioPlayer video {
		display:none;
		visibility:hidden;
		height:0;
	}

	.legacyIE #audioPlayer video {
		display:block !important;
	}

    #audioPlayer .player {
		width:100%;
		margin-bottom:20px;
		display: flex;
		justify-content: space-between;
    }
    #audioPlayer .player:after {
		display: none;
    }

        #audioPlayer .player li {
            position:relative;
			cursor:pointer;
        }

		#audioPlayer .player .rewind,
		#audioPlayer .player .forward,
		#audioPlayer .player .back,
		#audioPlayer .player .skip{
			opacity:.2;
			cursor:default;
			width:20%;
		}

		.pc_only #audioPlayer .player .rewind,
		.pc_only #audioPlayer .player .forward,
		.played #audioPlayer .player .rewind,
		.played #audioPlayer .player .forward,
		.played #audioPlayer .player .back,
		.played #audioPlayer .player .skip{
			opacity:1;
			cursor:pointer;
		}

		#audioPlayer .player .rewind,
		#audioPlayer .player .playAndPause {
			float:left;
			width:20%;
		}

		#audioPlayer .player .rewind {
		}

				#audioPlayer .player .playAndPause .play,
				#audioPlayer.playing .player .playAndPause .pause {
					display:block;
				}

				#audioPlayer.playing .player .playAndPause .play,
				#audioPlayer .player .playAndPause .pause {
					display:none;
				}

		#audioPlayer .player .forward {
			float:right;
		}
		#audioPlayer .player .forward img{
			float:right;
		}

	#audioPlayer .progressbar {
		position:relative;
		margin-bottom:15px;
	}

		#audioPlayer .progressbar .line {
			display:block;
			width:100%;
			height:6px;
			background:#eee;
		}

		.pc_only #audioPlayer .progressbar .line,
		.played #audioPlayer .progressbar .line {
			background-color:#b5b5b6;
		}

			#audioPlayer .progressbar .line .progress {
				display:block;
				position:relative;
				width:0;
				height:100%;
				background:#666666;
			}

				#audioPlayer .progressbar .line .progress .dial {
					position:absolute;
					right:0;
					top:0;
					width:3px;
					height:6px;
					background:#eee;
					cursor:pointer;
				}

    #audioPlayer .time {
		color:#666666;
        text-align:right;
    }

	.pc_only #audioPlayer .time,
	.played #audioPlayer .time {
		color:#666666;
	}

    #audioPlayer .volume {
        position:relative;
    }

	.ipad #audioPlayer .volume,
	.iphone #audioPlayer .volume,
	.android #audioPlayer .volume {
		display:none;
	}

        #audioPlayer .volume li {
            float:left;
            margin-right:10px;
			cursor:pointer;
        }

		#audioPlayer .volume .vol {
			position:relative;
		}

			#audioPlayer .volume .vol span {
				display:none;
				position:absolute;
				left:0px;
				top:5px;
			}

			#audioPlayer .volume .vol span.sound0 {
				display:block;
			}

			#audioPlayer .volume.mute .vol span {
				display:none !important;
			}

			#audioPlayer .volume.mute .vol span.sound0 {
				display:block !important;
			}
			#audioPlayer .volume .vol span img{
				width:30px;
				height:25px;
			}

		#audioPlayer .volume .minus {
			width:9%;
			margin-left:40px;
		}

		#audioPlayer .volume .plus {
			width:9%;
			margin-right:10px;
		}

	#audioPlayer .rate {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.rate li {
		background: #acacac;
		padding: 0.25rem 0.5rem;
		width: 18%;
		text-align: center;
		border-radius: 3px;
		color: #fff;
		margin-top: 1rem;
		cursor: pointer;
	}
    .rate.ie li {
		pointer-events: none;
        opacity:0.5;
	}
    .playing .rate.ie li {
		pointer-events: all;
        opacity:1;
	}
	.rate .active {
		background: #f65f4c;
		color: #fff;
	}

@media screen and (max-width:839px) {

	#audioPlayer {
		position:relative;
		width:80%;
		height:18vh;
    	margin-bottom:0px;
		padding:5% 10%;
		float:none;
	}

	.third_edition #audioPlayer {
		height:auto;
	}

	#audioPlayer .volume .minus {
		width:10%;
		margin-left:40px;
	}

	#audioPlayer .volume .plus {
		width:10%;
		margin-right:10px;
	}

}

/*-------------------------------------------------------------------------
	Form
/*-----------------------------------------------------------------------*/
#form{
	display: inline-block;
	position:relative;
}
#form div{
	font-size: 14px;
	border: 1px solid #b6b6b6;
	background: #fff;
	padding: 10px 20px;
	margin: 0 0 10px 0;
	display: inline-block;
}
#form div:after{
	display: none;
}

#form div a{
	padding:5px 10px;
	background-color:#f02800;
	display:inline-block;
	color:#fff;
}
#form .none{
	border:none;
	position:absolute;
	top: -10px;
	right: -15px;
	background-color:transparent;
	padding:0;
	margin:0;
}
#form .none a{
	background-color:transparent;
	padding:0;
}
#form .none a img{
	width:30px;
	height:30px;
}

@media screen and (max-width:839px) {
	#form{
		display: block;
		position: fixed;
		bottom:0;
	}
	#form div{
		font-size: 3.5vw;
		border-top: 1px solid #b6b6b6;
		border-left:0px;
		border-right:0px;
		border-bottom:0px;
		margin: 0;
	}
	#form div a{
	    margin: 2% 0 0 0;
	}
	#form .none{
		top: -10px;
		right: 5px;
	}
}

/*-------------------------------------------------------------------------
	Tabs
/*-----------------------------------------------------------------------*/
.tabs{
	width:90%;
	padding:7% 5% 0%;
}
.tabs li{
	display: inline-block;
	width: 50%;
	background-color: #bf1500;
	border-radius: 10px 0 0 10px;
	padding: 12px 0;
	font-size: 1.25rem;
	font-weight: 400;
	text-align: center;
	color: #fff;
}
.tabs .pra-training{
	background-color: #999;
	border-radius: 0 10px 10px 0;
}
.tabs .pra-training:hover{
	background-color: #f65f4c;
}
.tabs .pra-training a{
	color: #fff;
	padding: 18px 150px;
}
.tabs .tra-training {
	border-radius: 0 10px 10px 0 !important;
	background-color: #f65f4c;
}
.tabs .tra-practice{
	background-color: #999;
	border-radius: 10px 0 0 10px;
}
.tabs .tra-practice:hover{
	background-color: #bf1500;
}
.tabs .tra-practice a{
	color: #fff;
	padding: 18px 150px;
}


@media screen and (max-width:839px) {
	.tabs {
		padding: 10% 5% 5%;
	}
	.tabs li{
		width: 50%;
		border-radius: 2vw 0 0 2vw;
		padding: 2vw 0;
		font-size: 3.5vw;
	}
	.tabs .tra-training{
		border-radius: 0 2vw 2vw 0 !important;
	}
	.tabs .pra-training{
		background-color: #aaa;
		border-radius: 0 2vw 2vw 0;
	}
	.tabs .pra-training a{
		padding: 3vw 9vw;
	}
	.tabs .tra-practice{
		background-color: #aaa;
		border-radius: 2vw 0 0 2vw;
	}
	.tabs .tra-practice a{
		padding: 3vw 9vw;
	}
}

/*-------------------------------------------------------------------------
	Accordion
/*-----------------------------------------------------------------------*/
.attention{
	width:840px;
	margin:0 auto 50px auto;
	padding:50px 0 10px 0;
}
.attention a{
	display: inline-block;
}
.attention .for_mobile{
    border: 2px solid #f21b00;
    padding: 15px;
    line-height: 1.8;
}
.attention .for_mobile dt{
	font-size:1rem;
	font-weight:bold;
    display: inline-block;
	margin: 0 0 1% 0;
}
.attention .for_mobile dt span{
	background: linear-gradient(transparent 60%, #fcd1cc 60%);
}
.attention .for_mobile dt img{
    width: 20px;
    height: 26px;
	padding:0 10px 0 0;
}
.attention .for_mobile dd.case{
	font-size:0.85rem;
	font-weight:bold;
	color:#ff4522;
}
@media screen and (max-width:839px) {
	.attention{
		width:90%;
		margin:0 auto 6% auto;
		padding:5%;
	}
	.attention a{
		display: initial;
	}
		.attention .for_mobile dt{
		font-size:4vw;
	}
	.attention .for_mobile dt img{
		width:5vw;
		height:auto;
	}
}
/*-------------------------------------------------------------------------
	Questions
/*-----------------------------------------------------------------------*/
.questions_wrap {
	padding:60px 0 30px ;
	background:#fff;
}
#questions {
	opacity:.2;
}
#questions h3{
	font-size:2rem;
	font-weight:600;
	letter-spacing: 0.1rem;
	margin:70px 0 20px 0;
}
#questions h3#listning02 p,
#questions h3#listning04 p{
}
#questions h3 img.listening,
#questions h3 img.download{
	width:53px;
	height:auto;
	margin:0 1rem 0 0;
}
#questions,
#questions {
	opacity:1;
}

    #questions .box,
    #questions .download_box {
    	padding:0 50px;
        margin-bottom:50px;
    }
    #questions h3 p{
		display:inline-block;
		vertical-align: middle;
    }
    #questions ul {
        display: flex;
        flex-wrap: wrap;
        justify-content:flex-start;
        align-self: stretch;
    }

    #questions ul li {
        width:180px;
        margin:0 40px 30px 0;
    }
    #questions ul li span{
    	font-size:120%;
        font-weight:bold;
    }
    #questions ul li span.small{
    	font-size: 0.9rem;
		font-weight: normal;
		line-height: 1.3;
    }
    #questions ul li:nth-child(4n) {
	    margin-right:0;
	}
    #smart_start #questions .box ul li a:after {
        content:"";
        background: url(../../listening/common/img/icn_play_sub.svg) no-repeat;
        background-position:center;
        width:50px;
		height:40px;
		visibility:visible;
		margin: 0 10px 0 5px;
    }
	#smart_start #questions .box ul .btn-tra a:after {
        content:"";
        background: url(../../listening/common/img/icn_play_main.svg) no-repeat;
        background-position:center;
        width:50px;
		height:40px;
		visibility:visible;
		margin: 0 10px 0 5px;
	}
    #smart_start #questions .box:nth-child(2n) ul li a:after {
        background:url(../../listening/common/img/icn_play_sub.svg) no-repeat;
	    background-position: center;
    }
    #smart_start.reading_01 #questions .box ul li a:after {
        content:"";
        background:url(../../reading/files/img/icn_play_main.svg) no-repeat;
        background-position:center;
        width:26px;
		height:26px;
		visibility:visible;
		margin: 0 15px 0 5px;
    }
    #smart_start.reading_01 #questions .box:nth-child(2n) ul li a:after {
        background:url(../../reading/files/img/icn_play_sub.svg) no-repeat;
	    background-position: center;
    }
    #questions ul li a div{
	    font-size:1rem;
	    font-weight:bold;
	    line-height: 1.3;
	    padding:0 0 0 10px;
		width:100%;
		display: flex;
	    align-items: center;
	    justify-content: space-between;
	    word-break: keep-all;
   }
	#questions ul li a.gray div{
	    font-size:0.9rem;
	    font-weight:normal;
	}
    #questions ul li .active div{
       	color:#fff;
    }
	#questions ul li:last-child {
		margin-right:0px;
	}
		#questions .box a,
		#questions .download_box > a{
			cursor:pointer;
			pointer-events : auto;
			border: 3px solid;
			border-radius:8px;
		    height: 70px;
		    display: flex;
	        width: calc( 100% - 6px);
		    align-items: center;
		    background-color: #fff;
		    position: relative;
		    line-height: 1.5;
		}
		#questions .box a{
			border-color: #be1500;
		}
		#questions .box .btn-tra a{
			border-color: #f65f4c !important;
		}
		#questions .box a.gray{
			border: 2px solid #be1500 !important;
		}

		
		#questions .box ul:after{
			display: none;
		}
		/*#questions .box a.gray:hover{
			color:#fff;
		    transition:0.15s;
		}*/
		/*#questions .box a.gray {
			color:#999;
			border-color:#88c9ea !important;
		}*/
			/*#smart_start #questions .box a.gray:hover {
			    background-color: #88c9ea;
			}*/
			#smart_start #questions .box:nth-child(2n) a {
				border: 3px solid #0f7dda !important;
			}
			#smart_start #questions .box:nth-child(2n) a.gray {
				border: 2px solid #0f7dda !important;
			}
			/*#smart_start #questions .box:nth-child(2n) a.gray {
				border: 3px solid #74b0e7 !important;
			}*/
			/*#smart_start #questions .box:nth-child(2n) a.gray:hover {
				background-color:#74b0e7 !important;
			}*/
			#smart_start #questions .box a.active {
				background-color:#BF1500;
			}
			#smart_start #questions .box .btn-tra a.active {
				background-color:#f65f4c !important;
			}
			/*#smart_start #questions .box a.gray.active {
				background-color:#88c9ea !important;
			}*/
			#smart_start #questions .box:nth-child(2n) a.active {
				background-color:#0f7dda !important;
			}
			/*#smart_start #questions .box:nth-child(2n) a.gray.active {
				background-color:#74b0e7 !important;
			}*/
			#smart_start.reading_01 #questions .box:nth-child(2n) a {
				border: 3px solid #032e8f !important;
			}
			#smart_start.reading_01 #questions .box a.active {
				background-color:#0466bd !important;
			}
			#smart_start.reading_01 #questions .box:nth-child(2n) a.active {
				background-color:#032e8f !important;
			}
		#questions a.active img {
			opacity:0 !important;
		}
		#questions .btn_download{
		    font-size: 1.2rem;
		    color: #fff;
		    width: 46.3% !important;
			align-content: center;
		    justify-content: center;
		    text-align: center;
		    border-radius: 8px;
		}
		#questions .btn_download:hover{
		    opacity:0.8;
		}
		#questions .not_complete dt{
		    margin-top:1rem;
		    font-weight:bold;
		}
		.third_edition #questions .not_complete{
		    margin-top:2rem;
		}
		.third_edition #questions .not_complete a{
		    margin-top:1rem;
		}
		.third_edition #questions .not_complete .offline a{
		    text-decoration: underline;
		}
		.back_wrap {
		    text-align:center;
		}
		.back {
		    border-bottom:1px solid #000;
		    font-size:1.0rem;
		}
		.third_edition .back {
		    border-bottom:none;
		}

@media screen and (min-width:840px) {
	#questions .box a:hover{
		color:#fff;
		transition:0.15s;
	}
	#smart_start #questions .box a:hover {
		background-color: #BF1500;
	}
	#smart_start #questions .box .btn-tra a:hover {
		background-color: #f65f4c;
	}
	#smart_start #questions .box:nth-child(2n) a:hover {
		color:#fff;
		background-color:#BF1500 !important;
	}
	#smart_start.reading_01 #questions .box a:hover {
		background-color: #BF1500;
	}
	#smart_start.reading_01 #questions .box:nth-child(2n) a:hover {
		color:#fff;
		background-color:#BF1500 !important;
	}
}


@media screen and (max-width:839px) {
	.questions_wrap {
		width:90% !important;
		padding:0 0 5% 0;
	}
	#questions h3{
		font-size:6vw;
	}
	#questions h3 img.listening,
	#questions h3 img.download{
		width:12vw;
		float:left;
		margin:0 3vw 0 0;
	}
	#questions h3 p{
		width:65vw;
	}
    #questions .box,
    #questions .download_box {
    	padding:0 5%;
    	margin-bottom:15%;
    }
    #questions ul {
        justify-content:space-between;
    }
    #questions ul li {
       width:48%;
       margin:0 0 10px 0;
    }
    #questions ul li a div,
    #questions ul li a.gray div{
        font-size: 3.3vw;
        line-height: 1.3;
        padding: 0 0 0 3vw;
        height:auto;
    }
    #questions ul li a div span.small{
        font-size: 3.3vw;
    }
    #questions ul li a div:after{
    	content:none;
    }

    #questions .box ul li a:after {
        width:15vw !important;
		height:10vw !important;
		margin:0 2vw 0 1vw !important;
		background-size: 70% !important;
    }

	#questions .btn_download{
		font-size: 4.0vw;
	    width: 100% !important;
        height: 16vw;
        border:none !important;
	}
	#questions .box a,
	#questions .download_box a {
	    height: 16vw;
	}

}


/*-------------------------------------------------------------------------
	Accordion
/*-----------------------------------------------------------------------*/
	#accordion{

	}
		#accordion .cp_actab {
			max-width:940px;
			margin:0 auto;
	        padding:15px 0;
		}
		#accordion .cp_actab input {
			position: absolute;
			z-index: -1;
			opacity: 0;
		}
		#accordion .cp_actab label {
			font-weight: 400;
			line-height: 2;
			position: relative;
			display: block;
			padding: 0 3em 0 0;
			cursor: pointer;
			margin: 0 0 1px 0;
			font-size:1.1rem;
			color:#ffff00;
			width:51px;
			float:left;
			text-align: left;
	    cursor: default;
		}

		#accordion .cp_actab .cp_actab-content ul{
			display: flex;
	        flex-wrap: wrap;
            width:100%;
		}
		#accordion .cp_actab .cp_actab-content ul li{
			font-size:1rem;
			font-weight:200;
    		line-height: 2;
			margin: 0 2.5rem 0 0;
		}
		#accordion .cp_actab .cp_actab-content ul li a{
			color:#fff;
			text-decoration: underline;
		}
		#accordion .cp_actab .cp_actab-content ul .download_all{
			margin: 0;
		}

@media screen and (max-width:839px) {
		#accordion .cp_actab {
			position: relative;
			/* overflow: hidden; */
			width: 100%;
			margin: 0 auto;
			color: #ffffff;
			padding:2% 0;
		}
		#accordion .cp_actab input {
			position: absolute;
			z-index: -1;
			opacity: 0;
		}
		#accordion .cp_actab label {
			width:80%;
			padding:0 10%;
			float:none;
		}
		#accordion .cp_actab .cp_actab-content {
			overflow: hidden;
			max-height: 0;
			-webkit-transition: max-height 0.35s;
			transition: max-height 0.35s;
			color: #333333;
			/* opacity:0.8; */
            position: absolute;
            top: 54px;
		}
		#accordion .cp_actab .cp_actab-content li {
		    width: 80%;
    		margin: 0 10% !important;
			padding: 0.2rem 0 0 0;
			border-bottom: 1px solid #fff;
		}
		#accordion .cp_actab .cp_actab-content li:last-child {
			border-bottom: none;
		}
		#accordion .cp_actab .cp_actab-content ul li a{
			text-decoration: none;
			display: block;
			text-align: left;
		}
		/* :checked */
		#accordion .cp_actab input:checked ~ .cp_actab-content {
			max-height: 40em;
            padding-bottom: 2%;
		}
		/* Icon */
		#accordion .cp_actab label::after {
			line-height: 2;
			position: absolute;
			top: -0.3em;
			right: 0;
			display: block;
			width: 2em;
			height: 2em;
			-webkit-transition: all 0.35s;
			transition: all 0.35s;
			text-align: center;
    		margin: 0 3%;
		}
		#accordion .cp_actab input[type=checkbox] + label::after {
		    content: '+';
		    font-size: 1.5em;
		    font-weight: 100;
		}
		#accordion .cp_actab input[type=checkbox]:checked + label::after {
			transform: rotate(135deg);
		}

}
@media screen and (max-width:320px) {
		#accordion .cp_actab .cp_actab-content ul li {
			font-size:0.8rem;
		}
}
/*-------------------------------------------------------------------------
	reading_smart_logo
/*-----------------------------------------------------------------------*/
.smart{	
}
.smart img{
	width: 120px;
	position: absolute;
	top: 23px;
	left: 15px;
}
.smart p{
	font-size: 23px;
	line-height: 1;
	text-align: center;
	position: absolute;
	top: 57px;
	left: 44px;
	color: #0466bd;
	font-weight: 300;
}

@media screen and (max-width:839px) {
	.smart img {
		width: 28vw;
		top: 13vw;
		left: 7vw;
	}
	.smart p{
		font-size: 4.8vw;
		top: 21vw;
		left: 14.5vw;
	}
}



/*-------------------------------------------------------------------------
	sns
-------------------------------------------------------------------------*/
.sns{
	text-align: center;
	display: flex;
	align-items: start;
	justify-content: left;
	width: 500px;
	position: absolute;
	top: 145px;
}
.sns li{
	display:inline;
	margin:0 0.5vw;
}
@media screen and (max-width:839px) {
	.sns{
		text-align:center;
		display: flex;
		align-items: start;
		justify-content: center;
		width: initial;
		position: static;
	}
}


/*-------------------------------------------------------------------------
	third edition
-------------------------------------------------------------------------*/
.third_edition #audioPlayer .player li {
	width: 15%;
}
.reading_01.third_edition #questions .browser{
	margin-top:-70px;
}
.reading_01.third_edition #questions .browser a{
	border: none;
	padding: 0;
	height: auto;
	text-decoration: underline;
}
#smart_start.reading_01.third_edition #questions .box.browser a:hover{
	color:#000;
	background-color: transparent;
}
.third_edition .smart img{
	top: 13px;
}
.third_edition .smart p{
	top: 47px;
}

@media screen and (max-width:839px) {
	.reading_01.third_edition #questions .browser{
		margin-top:-5%;
	}
	.third_edition .smart img {
		top: 10vw;
	}
	.third_edition .smart p{
		top: 18vw;
	}
}