/*!
 * Start Bootstrap - Modern Business (https://startbootstrap.com/template/modern-business)
 * Copyright 2013-2020 Start Bootstrap
 * Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-logomodern-business-nav/blob/master/LICENSE)
 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;500&display=swap');
body {
  padding-top: 136px;
  font-family: 'Noto Sans TC',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  letter-spacing: 1px;
}
#regulation {
    line-height: 1.875;
}
img{
	max-width: 100%;
}
header picture img {
    width: 100%;
}
ul{
	list-style-type: none;
	padding-left: 0;
}
ul.disc{
	list-style-type: disc;
}
ol{
	padding-left: 20px;
}
a{
	text-decoration: none;
	transition: .3s;
}
a:hover{
	text-decoration: none;
	opacity: .8;
}
.text_hide{
	display: none;
}
.breadcrumb{
	background: transparent;
    margin-bottom: 0;
    padding: 0;
    padding-left: 5%;
    font-weight: 400;
}
.breadcrumb a,
.breadcrumb-item.active,
.breadcrumb-item+.breadcrumb-item::before{
	color: #fff;
}
.breadcrumb-item+.breadcrumb-item::before{
	content: ">";
}
.tit_wrap{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center left;
	height: 150px;
	display: flex;
	align-items: center;
}
.blue_section .tit_wrap{
	background-image: url(../images/head_bg_blue.svg);
}
.yellow_section .tit_wrap{
	/*background-image: url(../images/head_bg_yellow.svg);*/
	background-image: url(../images/head_bg_blue.svg);
}
.tit,
.tit_wrap p,
.winner_introduce .content,
article .paragraph_tit,
.card_lists li h5,
.results_wrap .title,
#regulation .content_wrap .title{
	position: relative;
}
.tit_wrap p{
	color: #fff;
	font-weight: 400;
	font-size: 1.6rem;
	letter-spacing: 2px;
	line-height: 1.2;
	background-repeat: no-repeat;
	padding-left: 55px;
}
.tit_wrap p span{
	font-size: 1rem;
	letter-spacing: 0;
}
.tit_wrap p:before,
.winner_introduce .content:before,
article .paragraph_tit:before,
.card_lists li h5:before,
.results_wrap .title:before,
#regulation .content_wrap .title:before,
.login .page-title span:before{
	content: "";
	clip-path: polygon(0 0, 30% 0, 30% 100%, 0% 100%);
    position: absolute;
    top: 0;
    left: 17px;
    width: 25px;
    height: 100%;
    transform: skew(-30deg, 1deg);
}
.blue_section .tit_wrap p:before{
	background-color: #7FADE3;
}
.yellow_section .tit_wrap p:before{
	/*background-color: #F3DD6D;*/
	background-color: #7FADE3;
}
.blue_section{
	background-color: #b8e0f0;
}
.yellow_section{
	/*background-color: #FCF5DF;*/
	background-color: #b8e0f0;
}

.carousel-item {
  height: 65vh;
  min-height: 300px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.portfolio-item {
  margin-bottom: 30px;
}
.pc_menu{
	margin-left: auto;
}

/* Navigation */
.navbar-dark .navbar-brand{
	padding-bottom: 10px;
}
.navbar-dark .navbar-brand img{
	width: 120px;
}
.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link:hover{
	color: #332F21;
	transition: .3s;
	font-weight: 500;
}
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .active>.nav-link{
	color: #332F21;
}
.navbar-dark .navbar-nav .nav-link:hover{
	font-weight: bold;
}
.navbar-nav li{
	padding: 0 24px;
}
.navbar-nav li:last-child{
	padding-right: 0;
}
.navbar-expand-lg .navbar-nav .nav-link{
	border-bottom: 3px solid transparent;
}
.yellow_section .navbar-expand-lg .navbar-nav .nav-link:hover,
.yellow_section .navbar-dark .navbar-nav .nav-item.active .nav-link{
	/*border-bottom: 5px solid #EAAA00;*/
	border-bottom: 5px solid #0957C3;
}
.blue_section .navbar-expand-lg .navbar-nav .nav-link:hover,
.blue_section .navbar-dark .navbar-nav .nav-item.active .nav-link{
	border-bottom: 5px solid #0957C3;
}
header .crumbs_wrap{
	background-color: #332F21;
	padding: 15px 0;
}
.main{
	position: relative;
	padding-top: 3rem;
}
.blue_section .main,
#intro{
	overflow: hidden;
}
.intro_space {
    min-height: 800px;
}
.main:before,
.main:after{
	content: "";
	position: absolute;
	background-repeat: no-repeat;
	background-size: 100%;
}
.main:before{
	width: 60px;
    height: 100%;
    top: 80px;
    z-index: -1;
}
.yellow_section .main:before{
	/*background-image: url(../images/main_symbol02_yellow.svg);*/
    /*right: 40px;*/
	background-image: url(../images/main_symbol02_white.png);
    left: 40px;
}
.yellow_section .main:after{
	content: "";
    background-image: url(../images/main_symbol03_white.png);
    position: absolute;
    right: -8.8vw;
    top: 20vw;
    width: 25vw;
    height: 50vw;
    z-index: -1;
}
/*.blue_section .main:before{
	background-image: url(../images/main_symbol02_white.png);
    left: 40px;
}*/
.blue_section .main:after{
	content: "";
    background-image: url(../images/main_symbol03_blue.png);
    position: absolute;
    right: -8.8vw;
    top: 20vw;
    width: 40vw;
    height: 50vw;
    z-index: -1;
}
.nav__appear{
	display: none;
}


/* Page - Index */
/*.ind_bn{
	background: url(../images/index_bn.svg) no-repeat top;
	background-size: 100%;
	padding-bottom: 50%;
}*/

/* Page - Intro */
.intro_space{
	padding: 0 0 10%;
	position: relative;
}
.intro_content_wrap{
	width: 100%;
	margin: 0 auto;
}
.intro_content_wrap ul{
	display: flex;
	justify-content: center;
}
.intro_content_wrap ul li{
	width: 33.33333%;
	text-align: center;
	margin: 0 15px;
}
.intro_content_wrap ul .block{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	background-color: #0957C3;
	width: 240px;
	height: 240px;
	border-radius: 50%;
	margin-bottom: 30px;
}
.intro_content_wrap ul .link{
	text-align: center;
	display: block;
}
.intro_content_wrap ul .link p{
	font-size: 1.5rem;
	font-weight: 400;
	color: #fff;
	background-color: #332F21;
	display: inline-block;
	padding: 5px 10px;
}
.intro_content_wrap.intro_inner_spirit,
.intro_content_wrap.intro_inner_expand,
.intro_content_wrap.intro_inner_faq{
	width: 75%;
}
.intro_content_wrap.intro_inner_expand ol{
	list-style-type: decimal-leading-zero;
}
.intro_content_wrap.intro_inner_expand ol li{
	margin-bottom: 30px;
	font-size: 1.1rem;
}
.intro_content_wrap.intro_inner_expand ul{
	display: block;
	list-style-type: disc;
}
.intro_content_wrap.intro_inner_expand ul li,
.intro_content_wrap.intro_inner_faq ul li{
	text-align: left;
	width: 100%;
	margin-bottom: 0;
	color: #494848 !important;
}
.intro_content_wrap.intro_inner_expand ul li a{
	color: #212529;
}
.intro_content_wrap.intro_inner_faq ul{
	display: block;
	list-style-type: disc;
}
.KWC1Title {
    font-weight: bolder;
    color: #000;
    margin-bottom: 20px;
    font-size: 1.75rem;
}
.KWC1-4Block {
    padding-bottom: 15px;
    border-bottom: dotted 1px #909296;
    margin-bottom: 30px;
}
.KWC1-4Content {
    color: #494848;
    min-height: 60px;
    padding-bottom: 20px;
    box-sizing: border-box;
}
.KWC1-4Icon {
    width: 40px;
    height: 40px;
    line-height: 1.5;
    text-align: center;
    color: #FFF;
    background-color: #0957C3;
    font-size: 1.5rem;
    position: absolute;
}
.IconA {
    background-color: #69646a;
}
.KWC1-4Content {
    color: #494848;
    min-height: 60px;
    padding-bottom: 20px;
    box-sizing: border-box;
}
.KWC1-4Content span {
    vertical-align: top;
    display: block;
    margin-left: 60px;
}

/* winner */
.winner_introduce{
	display: flex;
	align-items: center;
	margin-bottom: 5%;
}
.winner_introduce,
.winner_introduce h4,
.winner_introduce h2{
	font-weight: bold;
	color: #332F21;
}
.winner_introduce .content{
	margin-left: 120px;
}
.winner_introduce .content:before{
	left: -60px;
    width: 50px;
    height: 75%;
    top: 12px;
    background-color: #0957C3;
}
.winner_introduce .winner_portrait img{
	width: 180px;
	border-radius: 50%;
}
article{
	color: #332F21;
	font-weight: 400;
}
article .paragraph{
	margin-bottom: 5%;
	line-height: 1.8;
	letter-spacing: 1px;
}
article .paragraph_tit{
	padding-left: 45px;
	font-weight: 600;
	margin-bottom: 30px;
}
article .paragraph_tit:before{
	background-color: #0957C3;
}
.video_wrap{
	position: relative;
    overflow: hidden;
    padding-bottom: 56.250000%;
    display: block;
    height: 0;
}
.video_wrap iframe{
	max-width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
}
.message{
	text-align: right;
	margin-top: 30px;
}
.message a{
	display: inline-block;
    background: url(../images/icon_arrow.svg) no-repeat #0957C3 95% 55%;
    background-size: 10%;
    color: #fff;
    line-height: 1;
    padding: 5px 20px 5px 5px;
}

/* Winners */
.card_lists{
	display: flex;
	flex-wrap: wrap;
	margin: 0 11vw;
}
.card_lists li{
	width: 25%;
	background-size: 100%;
	padding: 20px;
	height: 13vw;
	background-repeat: no-repeat;
	transition: .3s;
	margin-bottom: 5%;
}
.card_lists li:nth-child(even){
	margin-top: 10%;
}
.card_lists li a{
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    height: 100%;
    color: #999790;
}
.card_lists li:hover a{
	color: #fff;
	opacity: 1;
}
.card_lists li h5{
	width: 100%;
	font-size: 1.5rem;
	padding-left: 40px;
}
.card_lists li h5:before{
	background-color: #999790;
	transition: .3s;
}
.card_lists li h5:hover{
	background: url(../images/icon_gray.svg) no-repeat;
}
.card_lists li:hover a h5:before{
	background-color: #fff;
}
.card_lists li .description{
	align-self: flex-end;
	margin-bottom: 0;
}
.blue_section .card_lists li{
	background-image: url(../images/card_blue.svg);
}
.blue_section .card_lists li:hover{
	background-image: url(../images/card_blue_hover.svg);
}
.yellow_section .card_lists li{
	/*background-image: url(../images/card_yellow.svg);*/
	background-image: url(../images/card_blue.svg);
}
.yellow_section .card_lists li:hover{
	/*background-image: url(../images/card_yellow_hover.svg);*/
	background-image: url(../images/card_blue_hover.svg);
}

.intro_space .results_wrap {
	max-width: 1440px;
}
/* Results */
.results_wrap{
	max-width: 970px;
	margin: 0 auto;
	width: 80%;
}
.results_table{
	width: 100%;
}
.results_table tr{
	/*border-bottom: 1px solid #F3DD6D;*/
	border-bottom: 1px solid #ffffff;
}
.results_table tr td{
	padding-top: 25px;
	padding-bottom: 25px;	
}
.results_table tr td:first-child{
	font-weight: 600;
}
.results_wrap .title{
	padding-left: 50px;
	font-weight: 600;
	margin-bottom: 30px;
}
.results_wrap .title:before{
	/*background-color: #EAAA00;*/
	background-color: #0957C3;
	width: 30px;
}

/* Regulation */
.regulation_menu{
	background-color: #7FADE3;
	margin-top: -4rem;
}
.regulation_menu ul{
	display: flex;
	margin-bottom: 0;
	padding-top: 15px;
	padding-bottom: 18px;
	margin-left: 50px;
	overflow-x: auto;
}
.regulation_menu ul li{
	padding-left: 10px;
	padding-right: 10px;
}
.regulation_menu ul li:first-child{
	padding-left: 0;
}
.regulation_menu ul li:last-child{
	padding-right: 0;
}
.regulation_menu ul li a{
	color: #0957C3;
	border-bottom: 3px solid transparent;
	transition: .3s;
	padding-bottom: 2px;
	letter-spacing: 1px;
	opacity: 1;
	white-space: nowrap;
}
.regulation_menu ul li.active a,
.regulation_menu ul li a:hover{
	color: #fff;
	border-bottom: 3px solid #fff;
}
#regulation .content_wrap .title{
	color: #332F21;
	font-weight: 600;
	padding-left: 40px;
	margin-bottom: 30px;
}
#regulation .content_wrap{
	padding-top: 3rem;
	max-width: 830px;
	margin: 0 auto;
	min-height: 100vh;
	margin-bottom: 100px;
}
#regulation .content_wrap .title:before{
	content: "";
	background-color: #0957C3;
}
.intro_content_wrap.intro_inner_expand ol li{
	color: #c80651;
}
.highlighter {
    color: #fff;
    background: #0000ff;
}
.highlighter2 {
    color: #000;
    background: #fff;
}
.highlighter3 {
    color: #0E43A6;
}


/* Background symbol */

#index {
    background-image: url(../images/index_bg_block2.png);
    min-height: 360px;
}
#index img {
    padding-right: 30px;
}

#dreamBooks,
#results{
    /*background-color: #9fcbe7;
    background-size: 30%, 45%;
    padding-top: 5%;
    padding-bottom: 2%;
    position: relative;
    overflow: hidden;*/
    min-height: 850px;
}
/*#dreamBooks:after,
#results:after {
    content: "";
    background-image: url(../images/signup_symbol_bottom.png);
    position: absolute;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 60px;
    height: 100%;
    top: 80px;
    right: 2vw;
    z-index: 0;
}
#dreamBooks:before,
#results:before{
    content: "";
    background-image: url(../images/signup_symbol_top.png);
    position: absolute;
    left: -4vw;
    top: 20vw;
    width: 20vw;
    height: 50vw;
    z-index: 0;
}*/

#pass{
    /*background-color: #addada;
    background-size: 30%, 45%;
    padding-top: 5%;
    padding-bottom: 2%;
    position: relative;
    overflow: hidden;*/
    min-height: 850px;
}
#pass .container {
    min-height: 850px;
}
/*#pass:before{
    content: "";
    background-image: url(../images/main_symbol02_green.png);
    position: absolute;
    top: 5vw;
    width: 160px;
    height: 988px;
    z-index: 0;
}*/
/*#dreamBooks,
#results,
#intro{
	position: relative;
}
#dreamBooks:after,
#results:after,
#intro:after{
	content: "";
	position: absolute;
	z-index: -1;
}
#dreamBooks:after{
    background-image: url(../images/dream_books_symbol.svg);
    left: -11.8vw;
    top: 50%;
    width: 35vw;
    height: 50vw;
    transform: translateY(-50%);
}
#results:after{
    background-image: url(../images/results_symbol.svg);
    left: -11.7vw;
    top: 10%;
    width: 50vw;
    height: 50vw;
}
#intro:after{
	background-image: url(../images/intro_symbol.svg);
    left: -13.7vw;
    top: 15%;
    width: 35vw;
    height: 50vw;
}*/


/* Footer */
.foot_wrap{
	position: relative;
}
.foot_symbol{
	background-repeat: no-repeat;
	width: 60%;
    height: 6.5vw;
    background-size: cover;
}
.yellow_section .foot_symbol{
	background-image: url(../images/main_symbol01_white.png);
	margin-right: auto;
	padding-bottom: 140px;
}
#pass .foot_symbol{
	height: 298px;;
	background-image: url(../images/main_symbol01_green.png);
	margin-left: auto;
        margin-right: 0px;
}
.blue_section .foot_symbol{
	background-image: url(../images/main_symbol01_white.png);
	margin-right: auto;
}
footer{
	color: #fff;
}
footer a,
footer a:hover{
	color: #fff;
}
.blue_section footer,
.yellow_section footer,
.index_section footer {
	background: #071e3c;
}
.yellow_section footer{
	/*background: #903B00;
	background: -moz-linear-gradient(left, #903B00 0%, #D9870D 100%);
	background: -webkit-linear-gradient(left, #903B00 0%, #D9870D 100%);
	background: linear-gradient(to right, #903B00 0%, #D9870D 100%);
	background: #002276;
	background: -moz-linear-gradient(left, #002276 0%, #004AC0 100%);
	background: -webkit-linear-gradient(left, #002276 0%, #004AC0 100%);
	background: linear-gradient(to right, #002276 0%, #004AC0 100%);*/
}
.blue_section footer{
	/*background: #002276;
	background: -moz-linear-gradient(left, #002276 0%, #004AC0 100%);
	background: -webkit-linear-gradient(left, #002276 0%, #004AC0 100%);
	background: linear-gradient(to right, #002276 0%, #004AC0 100%);*/
}
.foot_content_wrap{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.foot_content_wrap .foot_info{
	display: inline-flex;
	align-items: center;
	width: 80%;
}
.foot_content_wrap .icon_block img{
	width: 100%;
}
.foot_content_wrap .foot_info ul{
	margin: 15px 0 0 5%;
}
.foot_content_wrap .foot_info ul li{
	margin-bottom: 10px;
}
.foot_content_wrap .foot_info ul li:last-child{
	margin-bottom: 0;
}
.foot_content_wrap .foot_social{
	display: inline-flex;
	align-items: center;
	background: url(../images/icon_fb.svg) no-repeat left;
	background-size: 10%;
	padding-left: 20px;
	white-space: nowrap;
	line-height: 2;
}

/* login */
.mb_symbol_bottom{
	display: none;
}
body.login{
	padding-top: 0;
}
body.login header{
	padding-top: 15px;
    text-align: center;
    height: 120px;
    background-color: #fff;
    position: relative;
    box-shadow: 0 5px 5px rgb(0 0 0 / 10%);
}
body.login header .signOut a{
	position: absolute;
    font-size: 16px;
    line-height: 16px;
    top: 40px;
    right: 40px;
}
body.login header span{
	display: block;
    margin-top: 10px;
    font-size: 17px;
    letter-spacing: 15px;
    text-indent: 15px;
}
body.login footer{
	color: #000;
	padding: 35px 0;
}
body.login footer .container{
	display: flex;
	justify-content: center;
}
body.login footer p{
    margin-bottom: 0;
    margin-right: 40px;
    line-height: 22px;
}
body.login footer .KWIcon{
	margin-right: 15px;
    float: left;
}
body.login footer .KWTxt{
	line-height: 24px;
    float: left;
    display: block;
}
.login .content{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	max-width: 60%;
}

.login .kv-wrap{
    background-color: #b8e0f0;
    background-size: 30%, 45%;
    padding-top: 5%;
    padding-bottom: 20%;
    position: relative;
    overflow: hidden;
}

/*.login .kv-wrap:after {
    content: "";
    background-image: url(../images/signup_symbol_bottom.png);
    position: absolute;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 60px;
    height: 100%;
    top: 80px;
    right: 2vw;
    z-index: 0;
}
.login .kv-wrap:before{
    content: "";
    background-image: url(../images/signup_symbol_top.png);
    position: absolute;
    left: -4vw;
    top: 20vw;
    width: 20vw;
    height: 50vw;
    z-index: 0;
}*/
/*.login .kv-wrap:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	background: url(../images/signup_symbol_bottom2.png) no-repeat bottom;
	background-size: 100%;
	width: 55%;
    height: 125px;
}*/
.login .page-title{
	width: 100%;
	text-align: center;
	font-size: 2rem;
	margin-bottom: 5%;
	padding-bottom: 5%;
	border-bottom: 2px solid #000;
}
.login .page-title span{
	position: relative;
	padding-left: 50px;
}
.login .page-title span:before{
	content: "";
	background-color: #000;
	width: 30px;
    height: 45px;
}

.login .col-form-label{
	text-align: right;
    padding-right: 0;
    width: 170px;
}

.login .form-control{
	border: 0;
    border-bottom: 1px solid #000;
    border-radius: 0;
    padding-left: 0;
    margin-left: 10px;
    margin-bottom: 10px;
}

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

.login .form-point {
    padding-left: 0;
    margin-left: 10px;
    margin-bottom: 10px;
}

.login a{
	color: #000;
}

.login .form-group a{
	
	margin-left: 10px;
}

.login .btn-wrap{
	text-align: center;
}

.login .login-l{
	margin-bottom: 30px;
}

.login .btn-wrap .btn-box{
	background-color: #0000ff;
    color: #fff;
    border: 0;
    padding: 8px 40px 8px 30px;
    margin: 0 10px;
    position: relative;
}

.login .btn-wrap button:after{
	content: "";
    position: absolute;
    background-image: url(../images/icon_arrow.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 20px;
    height: 13px;
    top: 60%;
    right: 15px;
    transform: translateY(-60%);
}
.login.result .main-content{
	width: 80%;
}
.login.result .point{
	margin-bottom: 20px
	;
}
.login.result .btn-wrap{
	text-align: left;
}
.login.result .btn-wrap .btn-box{
	white-space: nowrap;
	margin-bottom: 10px;
}
@media (max-width: 768px){
	.login.result .btn-wrap .btn-box{
		margin-left: 0;
	}
    #dreamBooks,
    #results {
        z-index: -2;
    }
}



@media screen and (min-width: 1280px) and (max-width: 1440px){
	.navbar-dark .navbar-brand,
	.foot_content_wrap .foot_info{
		margin-left: -5%;
	}
}

@media (min-width: 1440px){
	.container{
		max-width: 1440px;
		width: 80%;
	}
	.card_lists li h5{
		font-size: 2rem;
	}
	.navbar-dark .navbar-brand,
	.foot_content_wrap .foot_info{
		margin-left: -9%;
	}
}

@media (min-width: 992px){
	.navbar-expand-lg .navbar-nav .nav-link{
		padding-right: 0;
		padding-left: 0;
	}
}
@media (max-width: 1280px){
	.navbar-nav li{
		padding: 0 22px;
	}
}
@media (max-width: 1200px){
	.intro_content_wrap ul .block{
		width: 180px;
		height: 180px;
		padding: 40px;
	}
	.card_lists{
		margin: 0 5vw;
	}
	.card_lists li{
		height: 17vw;
	}
	.card_lists li h5{
		font-size: 1.8rem;
	}
}
@media (max-width: 991px){
	body{
		padding-top: 92px;
	}
	body.mask{
		position: relative;
	}
	body.mask:after{
		content: "";
		background-color: rgba(0,0,0,.5);
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.navbar-nav li{
		margin-bottom: 20px;
	}
	.navbar-dark .navbar-brand img{
		width: 70px;
	}
	.icon__menu {
	  text-align: center;
	}
	.icon__menu svg {
	  width: 36px;
	  margin-left: auto;
	  margin-right: auto;
	  overflow: visible;
	  color: #000;
	}
	.icon__menu .outline {
	  stroke: #2a2a2a;
	  fill: none;
	  stroke-width: 2px;
	  stroke-miterlimit: 10;
	}
	.icon__menu__close {
	  display: none;
	}

	.pc_menu{
		display: none;
	}
	.nav__appear{
		background-color: #9fbfe4;
	}
	.yellow_section .nav__appear{
		/*background-color: #FCF5DF;*/
		background-color: #9fbfe4;
	}
	.blue_section .nav__appear{
		background-color: #9fbfe4;
	}
	.nav__appear {
		display: block;
		transform: translateX(220px);
		margin-top: 92px;
		padding: 20px;
		height: 100%;
		width: auto;
		position: fixed;
		top: 0;
		right: 0;
		border-left: 1px solid #f0e6d9;
		transition: all 200ms ease-in-out;
	}

}
@media (max-width: 992px){
	.container{
		max-width: 960px;
	}
	.intro_content_wrap ul .block{
		width: 150px;
		height: 150px;
		padding: 30px;
	}
	.intro_content_wrap ul .link p{
		font-size: 1.2rem;
	}
	.foot_content_wrap,
	.foot_content_wrap .foot_info{
		flex-wrap: wrap;
	}
	.foot_content_wrap .icon_block{
		width: 60%;
	}
	.foot_content_wrap,
	.foot_content_wrap .foot_info,
	.foot_content_wrap .foot_info ul{
		width: 100%;
		flex-wrap: wrap;
	}
	.foot_content_wrap .foot_info ul{
		margin-left: 0;
		margin-top: 0;
	}
	.foot_content_wrap .foot_info,
	.foot_content_wrap .icon_block{
		margin-bottom: 30px;
	}
	body.login footer a:hover{
		color: #000;
	}
	body.login footer .container{
		display: block;
		text-align: center;
	}
	body.login footer p{
		margin-bottom: 20px;
	}
	body.login footer .KWFB{
		width: 100%;
	    display: flex;
	    justify-content: center;
	}
	body.login footer .KWTxt{
		text-align-last: left;
	}
}
@media (max-width: 768px){
	body{
		font-size: .8rem;
	}
	.container{
		max-width: 100%;
		padding-right: 30px;
		padding-left: 30px;
	}
	.tit_wrap{
		font-size: 1.4rem;
		height: 90px;
	}
	.tit_wrap p,
	.h3, h3,
	.h2, h2{
		font-size: 1.2rem;
		line-height: 1.5;
		margin-bottom: 0;
	}
	.h4, h4{
		font-size: 1rem;
	}
	.tit_wrap p:before{
		height: 90%;
	}
	.main:before{
		width: 40px;
	}
	.yellow_section .main:before{
		top: 10px;
		left: 20px;
	}
	.blue_section .main:before{
		top: 4px;
		left: 25px;
	}
	.blue_section .main:after,
	#regulation.main:after{
		background-image: url(../images/main_symbol03_blue@mb.svg);
		width: 35vw;
		top: auto;
		bottom: -40px;
	}
	.intro_content_wrap ul{
		flex-wrap: wrap;
	}
	.intro_content_wrap ul li{
		width: 100%;
		margin-bottom: 15%;
	}
	.intro_content_wrap ul li:last-child{
		margin-bottom: 0;
	}

	.intro_content_wrap ul .block{
		width: 220px;
		height: 220px;
		padding: 0;
	}
	.intro_content_wrap ul .block img{
		width: 60%;
	}
	.intro_content_wrap ul .link p{
		font-size: 1.2rem;
	}
	.intro_content_wrap.intro_inner_spirit,
	.intro_content_wrap.intro_inner_expand,
	.intro_content_wrap.intro_inner_faq{
		width: 100%;
	}
	.intro_content_wrap.intro_inner_expand ul li{
		margin-bottom: 0;
	}
	.KWC1Title {
	    font-size: 1.2rem;
	}
	.winner_introduce{
		flex-wrap: wrap;
	}

	.winner_introduce .winner_portrait{
		width: 100%;
		text-align: center;
		margin-bottom: 5%;
	}
	article .paragraph_tit{
		background-size: 8%;
	}
	.message{
		text-align: center;
		margin-bottom: 5%;
	}
	.card_lists{
		margin: 0;
	}
	.card_lists li{
		width: 50%;
		height: 45vw;
	}
	.card_lists li{
		margin-bottom: 0;
		height: 42vw;
	}
	.card_lists li h5{
		font-size: 1.4rem;
	}

	.results_wrap{
		width: 100%;
	}
	.results_wrap .title{
		margin-bottom: 50px;
	}
	.results_wrap .title:before{
		height: 80%;
	}
	.results_table tr{
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 20px;
	}
	.results_table tr td{
		width: 100%;
		padding-top: 0;
		padding-bottom: 0;
	}
	.results_table tr td:first-child{
		padding-bottom: 5px;
	}
	.results_table tr td:last-child{
		padding-bottom: 20px;
	}
	.regulation_menu ul{
		margin-left: 0;
	}
	.winner_introduce .content{
		margin-left: 90px;
	}
	.winner_introduce .content:before{
		width: 40px;
	}
	article .paragraph_tit,
	#regulation .content_wrap .title{
		margin-bottom: 20px;
	}

	/*#dreamBooks:after{
        left: -30.8vw;
	    top: 30%;
	    transform: translateY(-30%);
	    width: 65vw;
	    height: 90vw;
	}*/
	#dreamBooks:after,
	#results:after{
	    right: 5vw;
	    top: 5%;
	    width: 10vw;
	    height: 160vw;
        z-index: -1;
	}
	#dreamBooks:before,
	#results:before {
	    left: -10vw;
	    top: 100vw;
	    width: 40vw;
	    height: 100vw;
        z-index: -1;
	}
	#intro:after{
	    right: -20vw;
	    top: 15%;
	    width: 75vw;
	    height: 100vw;
	}
	footer.py-5{
		padding-top: 2rem!important;
		padding-bottom: 1rem!important;
	}
	.foot_content_wrap .foot_info, 
	.foot_content_wrap .icon_block,
	.foot_content_wrap .foot_social{
		font-size: .5rem;
		font-weight: 300;
		margin-bottom: 20px;
	}
	.foot_content_wrap .foot_social{
		background-size: 8%;
		padding-left: 10px;
	}
	.foot_symbol{
		height: 11vw;
		width: 100%;
	}
	.yellow_section .foot_symbol {
		padding-bottom: 63px;
	}
	.mb_symbol_bottom{
		display: block;
	}
	.login .content{
		max-width: 100%;
	}
	fieldset{
		padding: initial;
	}
	textarea{
		width: 100%;
	}
	/*.login .kv-wrap{
		height: auto;
		background:url(../images/signup_symbol_top@mb.png) no-repeat top left;*/
					/*url(../images/signup_symbol_bottom@mb.png) no-repeat bottom;*/
		/*background-size: 30%;
		padding-top: 20%;
		font-size: .7rem;
	}*/
	.login .kv-wrap:after{
        display: none;
		/*background: none;*/
	}
	.login .page-title{
		font-size: 1.5rem;
	}
	.login .page-title span{
		padding-left: 20px;
	}
	.login .page-title span:before{
		width: 28px;
    	height: 30px;
    	top: 2px;
    	left: -5px;
	}
	.login .page-title{
		padding-bottom: 10%;
		margin-bottom: 10%;
	}
	.login .form-control{
		height: calc(1.2em + .5rem + 2px);
		font-size: .7rem;
	}
	.login .col-form-label{
		width: 85px;
	}


	
}

.upload .item {
    padding-top: 5px;
    padding-bottom: 5px;
}
.upload .item span {
    display: inline-block;
    width: 200px;
}
.upload-image-btn img {
    width: 200px;
}

@media (max-width: 768px) {
    .upload .item span {
        display: block;
        width: 100%;
    }
    .upload-image-btn img {
        width: 100%;
    }
}

.pc-only {
	display: block;
}
.mobile-only {
	display: none;
}
.blackbg {
    background-color: #000 !important;
}

#index {
	padding-bottom: 50px;
}
#index table {
	width: 90%;
}
#index tr {
	height: 100px;
}
.main2 {
	background-color: #2596be;
	color: #fff;
	font-size: 25px;
	padding-top: 10px;
	padding-bottom: 10px;
	letter-spacing: 5px;
}
@media (max-width: 768px) {
	.pc-only {
		display: none;
	}
	.mobile-only {
		display: block;
	}
	#index tr {
		height: 60px;
	}
	.main2 {
		font-size: 12px;
		padding-top: 10px;
		padding-bottom: 10px;
		letter-spacing: 1px;
	}
}