﻿@charset "UTF-8";
/**
*
* @authors Your Name (you@example.org)
* @date    2016-12-10 16:57:22
* @version $Id$
*/

/*
purple #B1658B;
red #CA2420;
blue #326295;
orange #F89829;
*/

*{
	box-sizing: border-box;
}

img{
	display: block;
}

html,body{
	letter-spacing: 3px;
	font-family: "微軟正黑體", "微软雅黑","Helvetica Neue", Helvetica, Arial, sans-serif;
	min-height: 100% !important;
    height: 100%;
    padding: 0;
    margin: 0;
    background: #70a9f4;
}

body{
	overflow-x: hidden;
}

img.illfull{
	width: 100%;
}

.wrap{
	position: relative;
	display: block;
	margin: 0 auto;
	padding: 0;
	width: 100%;
	max-width: 768px;
}

header{
	position: fixed;
	display: block;
	top: 0;
	width: 100%;
	max-width: 768px;
	padding: 20px 20px;
	background: #FFF;
	z-index: 10;
}

.kv{
	position: relative;
	width: 100%;
	margin-top: 87px;
	border-top: 5px solid #79a9f8;
	border-bottom: 5px solid #908de3;
}

.kv .gobtn{
	position: fixed;
	bottom: 10%;
	right: 2%;
	width: 5vw;
	min-width: 60px;
	z-index: 9;
}

.kv .gobtn img{
	width: 100%;
}

.kv .extra{
	position: absolute;
	bottom: 0;
	right: 0;
	padding: 20px;
	font-size: 22px;
	letter-spacing: 0;
	color: #000;
	/*text-shadow: -2px 0 #FFF, 0 2px #FFF,
      2px 0 #FFF, 0 -2px #FFF*/
}

.kv .extra a{
	color: #000;
	text-underline-offset: 2px;
	text-decoration: underline;
}

.kv .extra a: hover{
	color: #000;
	text-decoration: underline;
}

.container{
	display: inline-block;
	position: relative;
	width: 100%;
	padding: 30px 25px;
	/*margin-bottom: 100px;*/
	background: #FFF;
}

.memo{
	width: 100%;
	padding-bottom: 30px;
	letter-spacing: 0;
	/*
	font-size: 21px;
	line-height: 36px;
	*/
	font-size: 18px;
	line-height: 22px;
}

.info{
	width: 100%;
	padding: 30px 0;
	border-bottom: 1px solid #000;
}

.info .title{
	width: 100%;
	color: #3560a6;
	font-size: 45px;
	letter-spacing: 0;
}

.info .title.txtbold{
	font-weight: bold;
}

.info span.extra{
	padding-right: 20px;
	font-size: 28px;
	vertical-align: top;
	line-height: 50px;
}

.info .group{
	display: inline-block;
	width: 100%;
	padding-top: 30px;
	padding-left: 64px;
}

.info .group.nopadding{
	padding: 0;
}

.info .group label{
    padding: 0;
    margin-right: 0px;
    cursor: pointer;
}

.info .group .childcol{
	width: 33.3333%;
	float: left;
}

.info .group .childcol.spec{
	width: auto;
	padding-right: 2vw;
}

.info .group .childcol input[type=checkbox] {
    display: none;
}

.info .group .childcol input[type=checkbox] + span {
    display: inline-block;
    padding-left: 50px;
    background: url("../images/Agree.png") no-repeat;
    user-select: none;
    font-size: 30px;
    font-weight: 300;
    width: 100%;
    letter-spacing: 1;
    color: #000000;
    min-height: 40px;
}

.info .group .childcol input[type=checkbox]:checked + span {
    background: url("../images/AgreeCheck.png") no-repeat;
}

.info .group input[type=radio] {
    display: none;
}

.info .group input[type=radio] + span {
    display: inline-block;
    padding-left: 46px;
    padding-right: 15px;
    line-height: 38px;

    background: url("../images/TypeBox.png") center left no-repeat;

    user-select: none;
    font-size: 32px;
    letter-spacing: 0;
    color: #000000;
}

.info .group input[type=radio]:checked + span {
    background: url("../images/Type.png") center left no-repeat;
}

.info .group.spec input[type=radio] {
    display: none;
}

.info .group.spec input[type=radio] + span {
	width: 100%;
    display: inline-block;
    padding-left: 66px;
    line-height: 52px;
    background: url("../images/TypeBox.png") no-repeat;
    user-select: none;
    font-size: 45px;
    font-weight: 300;
    letter-spacing: 0;
    color: #000000;
}

.info .group.spec input[type=radio]:checked + span {
    background: url("../images/Type.png") no-repeat;
}

.info .transfer{
	width: 100%;
	padding-top: 52px;
	padding-bottom: 30px;
}

.info .transfer img{
	width: 100%;
	max-width: 410px;
}

.info .competition{
	width: 100%;
	padding-top: 30px;
}

.info .competition .team{
	width: 100%;
	display: inline-block;
	padding-bottom: 20px;
}

.info .competition .team span.title{
	float: left;
	display: inline-block;

	color: #3560a6;
	font-size: 45px;
	letter-spacing: 0;
	height: 52px;
}

.info .competition .team span.title:after {
	content: "";
	display: inline-block;
	width: 100%;
}

.info .competition .team .object{
	padding-left: 20px;
}

.info .competition .team .object input[type=text]{
	width: 100%;
	padding: 5px 10px;
	border-radius: 5px;
	border: 1px solid #858585;
	background: #f4f4f4;
	font-size: 32px;
}

.info .competition .team .object select{
	width: 100%;
	padding: 8px 12px;
	border-radius: 5px;
	border: 1px solid #858585;
	font-size: 32px;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	background: url(../images/drop.png) no-repeat center right 10px #f4f4f4;
}


.info .competition .team.team-category-1 span.title{
	width: 230px;
}

.info .competition .team.team-category-1 span.title:before{
	content: "◎";
}

.info .competition .team.team-category-1 .object{
	float: left;
	width: calc(100% - 230px);
}

.info .competition .team.team-category-1 .object select{
	min-height: 57px;
}



.info .competition .team.team-category-1 .extra{
	float: left;
	width: 100%;
	padding-top: 20px;
	text-align: left;
}

.info .competition .team.team-category-1 .extra a{
	display: inline-block;
	width: 100%;
    max-width: 215px;
	background: #1d85ce;
	font-size: 26px;
	color: #FFF;
	padding: 10px 5px;
	border-radius: 10px;
	-webkit-box-shadow: 0px 5px #3d7cba;
	-moz-box-shadow: 0px 5px #3d7cba;
	box-shadow: 0px 5px #3d7cba;
	text-decoration: none;
    text-align:center;
	font-weight: 300;
}

.info .competition .team.team-category-1 .extra a.lock{
	display: none;
	background: #cfcfcf;

    -webkit-box-shadow: 0px 5px #cfcfcf;
	-moz-box-shadow: 0px 5px #cfcfcf;
	box-shadow: 0px 5px #cfcfcf;
}

.info .competition .team.team-category-1 .extra a.lock.open{
    display: inline-block;
}

.info .competition .team.team-category-1 .extra a:hover{
	color: #FFF;
	text-decoration: none;
}

.info .competition .team.team-category-3 span.title{
	width: 320px;
}

.info .competition .team.team-category-3 span.title:before{
	content: "◎";
}

.info .competition .team.team-category-3 .object{
	float: left;
	width: calc(100% - 320px);
}

.info .competition .team.team-category-3 .object input{
	min-height: 57px;
}


.info .judge{
	width: 100%;
	padding-top: 30px;
}

.info .judge label{
	display: inline-block;
    padding: 0;
    margin-right: 0px;
    cursor: pointer;
}

.info .judge label a{
	color: #000;
}

.info .judge input[type=checkbox] {
    display: none;
}

.info .judge input[type=checkbox] + span {
    display: inline-block;
    padding-left: 50px;
    background: url("../images/Agree.png") no-repeat;
    user-select: none;
    font-size: 30px;
    letter-spacing: 1;
    color: #000000;
}

.info .judge input[type=checkbox]:checked + span {
    background: url("../images/AgreeCheck.png") no-repeat;
}

.send{
    display: inline-block;
	width: 100%;
	padding: 50px 10px;
	text-align: center;
}

.send img.sendbtn{
	width: 100%;
	max-width: 498px;
	display: inline-block;
}

.accordion{
	width: 100%;
	padding: 30px 0;
}

.accordion a.controller{
	position: relative;
	display: inline-block;
}

.accordion a.controller .switchbtn{
	position: absolute;
	width: 6%;
	top: 35%;
	right: 15%;
}


.accordion .detail{
	display: none;
	width: 100%;
	padding: 20px 0 0 0;
	font-size: 18px;
	line-height: 22px;
	letter-spacing: 0;
}

.accordion .detail.big{
	font-size: 20px;
}

.accordion .detail span.highlight{
	font-size: 20px;
}

.accordion .detail font.headtxt{
	font-size: 24px;
}

.accordion .detail table.first{
	width: 100%;
	border-collapse:separate;
	border-spacing:0;
	color: #385391;
}

.accordion .detail table.first th{
	border-color: #2b2b2b;
	border-style:solid;
	border-width:1px;

	border-radius: 15px 15px 0px 0px;
	overflow:hidden;
	padding: 10px 5px;
	font-size: 18px;
	font-weight: normal;

	font-size: 32px;
	font-weight: bold;
}

.accordion .detail table.first th.noborderradius{
	border-radius: 0;
}

.accordion .detail table.first td{
	border-color: #2b2b2b;
	border-style:solid;
	border-width:1px;
	border-top: 0;
	overflow:hidden;
	padding:10px 5px;
}

.accordion .detail table.first td:nth-child(even){
	border-left: 0;
}

.accordion .detail table.first td.last-left{
	border-radius: 0px 0px 0px 15px;
}

.accordion .detail table.first td.last-right{
	border-radius: 0px 0px 15px 0px;
}

.accordion .detail table.first th .group{
	width: 100%;
	display: flex;
	align-content: center;
	align-items: center;
}

.accordion .detail table.first th .group .item{
	display: inline-block;
	float: left;
}

.accordion .detail table.first th .group .item.s1{
	text-align: right;
	width: 40%;
	padding-right: 3%;
}

.accordion .detail table.first th .group .item.s1.spec{
	padding-top: 0px;
}

.accordion .detail table.first th .group .item.s1 img{
	width: 28%;
	display: inline-block;
}

.accordion .detail table.first th .group .item.s1.spec img{
	width: 40%;
	display: inline-block;
}

.accordion .detail table.first th .group .item.s2{
	text-align: left;
	width: 60%;
}

.accordion .detail table.first th .group .item.s2.spec{
}

.accordion .detail table.first td{
	border-color: #2b2b2b;
	text-align: left;
	vertical-align:top;
	font-size: 20px;
	font-weight: normal;
	background: #f2f2f2;
}

.accordion .detail table.first span.hstyle1{
	font-size: 32px;
	font-weight: bold;
	line-height: initial;
}

.accordion .detail table.first span.hstyle2{
	font-size: 28px;
	font-weight: bold;
	line-height: initial;
}

.accordion .detail table.first span.hstyle3{
	font-size: 24px;
	font-weight: normal;
	line-height: initial;
}

.accordion .detail table.first span.hstyle4{
	font-size: 22px;
	font-weight: bold;
	line-height: initial;
}

.accordion .detail table.first span.hstyle4.red{
	color: #f15d76;
}

.accordion .detail .notice{
	display: inline-block;
	width: 100%;
}

.accordion .detail .notice .item{
	width: 60px;
	float: left;
}

.accordion .detail .notice .description{
	width: calc(100% - 60px);
	float: left;
}

.accordion .detail ul.num{
	width: 100%;
	margin-top: 5px;
}

.accordion .detail ul.num li{
	list-style-type: decimal;
}

.accordion .detail span.red{
	color: #b02418;
}

.accordion .detail table.second{
	width: 100%;
	border-collapse:collapse;
	border-spacing:0;
}

.accordion .detail table.second td{
	border-color: #2b2b2b;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	padding:10px 5px;
}
.accordion .detail table.second th{
	border-color: #2b2b2b;
	border-style:solid;
	border-width:1px;
	border-bottom: 0;
	overflow:hidden;
	padding:10px 5px;
	font-size: 18px;
	font-weight: normal;
}
.accordion .detail table.second td{
	border-color: #2b2b2b;
	text-align:center;
	vertical-align:top;
	font-size: 18px;
	font-weight: normal;
}

.accordion .detail .extra{
	width: 100%;
	font-size: 28px;
}

.accordion .detail .extra a{
	color: #000;
}

.accordion .detail .extra a: hover{
	color: #000;
}

footer{
	display: inline-block;
	position: relative;
	width: 100%;
	padding: 25px 25px 60px 25px;
	/*margin-bottom: 100px;*/
	background: #f6f6f6;
}

footer ul{
	display: inline-block;
	position: relative;
	width: 100%;
	padding: 20px 0;
	margin: 0;
}

footer ul li{
	display: inline-block;
	position: relative;
	float: left;
	width: 33.33333%;
	text-align: center;

	border-left: 1px solid #363636;
}

footer ul li:first-child{
	
	border-left: 0;
}

footer ul li a{
	color: #363636;
	font-size: 22px;
	text-decoration: none;
}

footer ul li a:hover{
	color: #363636;
	text-decoration: underline;
}

footer .copyright{
	display: inline-block;
	position: relative;
	width: 100%;
	padding-top: 10px;

	color: #363636;
	font-size: 22px;
}

.errortxt {
    display: inline-block;
    width: 100%;
    padding-bottom: 30px;
    font-size: 22px;
    letter-spacing: 0;
    color: red;
}

/*小於等於720*/
@media (max-width: 720px) {
	header{
		padding: 16px 16px;
	}

	header img{
		width: 160px;
	}

	.kv{
		margin-top: 71px;
		border-top: 5px solid #79a9f8;
		border-bottom: 5px solid #908de3;
	}

	.kv .extra{
		padding: 10px;
		font-size: 16px;
		letter-spacing: 0;
	}

	.container{
		padding: 14px 20px;
		/*margin-bottom: 60px;*/
	}

	.memo{
		padding-bottom: 20px;
		/*
		font-size: 16px;
		line-height: 26px;
		*/
		font-size: 13px;
		line-height: 18px;
	}

	.info{
		padding: 20px 0;
	}

	.info .title{
		font-size: 22px;
	}

	.info span.extra{
		padding-right: 8px;
		font-size: 18px;
		line-height: 30px;
	}

	.info .group{
		width: 100%;
		padding-top: 10px;
		padding-left: 26px;
	}

	.info .group input[type=radio] + span {
	    display: inline-block;
	    padding-left: 32px;
	    line-height: 32px;
	    background: url("../images/TypeBox.png") center left no-repeat;
	    background-size: auto 100%;
	    font-size: 22px;
	}

	.info .group input[type=radio]:checked + span {
	    background: url("../images/Type.png") center left no-repeat;
	    background-size: auto 100%;
	}

	.info .group.spec input[type=radio] + span {
	    display: inline-block;
	    padding-left: 10vw;
	    line-height: 32px;
	    background: url("../images/TypeBox.png") center left no-repeat;
	    background-size: 80% auto;
	    font-size: 22px;
	}

	.info .group.spec input[type=radio]:checked + span {
	    background: url("../images/Type.png") center left no-repeat;
	    background-size: 80% auto;
	}

	.info .group .childcol input[type=checkbox] + span {
	    display: inline-block;
	    padding-left: 30px;
	    background: url("../images/Agree.png") no-repeat;
	    background-size: 25px auto;
	    user-select: none;
	    font-size: 20px;
	    font-weight: 300;
	    letter-spacing: 0;
	    color: #000000;
	    min-height: 40px;
	}

	.info .group .childcol input[type=checkbox]:checked + span {
	    background: url("../images/AgreeCheck.png") no-repeat;
	    background-size: 25px auto;
	}

	.info .transfer{
		width: 100%;
		padding-top: 32px;
		padding-bottom: 20px;
	}

	.info .transfer img{
		width: 100%;
		max-width: 280px;
	}

	.info .competition{
		padding-top: 20px;
	}

	.info .competition .team{
		padding-bottom: 10px;
	}

	.info .competition .team span.title{
		font-size: 24px;
		height: 30px;
	}

	.info .competition .team .object{
		padding-left: 10px;
	}

	.info .competition .team .object input[type=text]{
		padding: 3px 5px;
		font-size: 22px;
	}

	.info .competition .team .object select{
		padding: 8px 12px;
		font-size: 22px;
	}


	.info .competition .team.team-category-1 span.title{
		padding-top: 5px;
		width: 120px;
	}

	.info .competition .team.team-category-1 .object{
		float: left;
		width: calc(100% - 120px);
	}

	.info .competition .team.team-category-1 .object select{
		min-height: 43px;
	}

	.info .competition .team.team-category-1 .extra{
		padding-top: 10px;
	}

	.info .competition .team.team-category-1 .extra a{
		font-size: 22px;
		padding: 10px 0px;
	}


	.info .competition .team.team-category-3 span.title{
		padding-top: 5px;
		width: 170px;
	}

	.info .competition .team.team-category-3 .object{
		float: left;
		width: calc(100% - 170px);
	}

	.info .competition .team.team-category-3 .object input{
		min-height: 43px;
	}

	.info .judge{
		padding-top: 20px;
	}

	.info .judge input[type=checkbox] {
	    display: none;
	}

	.info .judge input[type=checkbox] + span {
	    font-size: 18px;
	}

	.send{
		padding: 30px 15% 20px 15%;
	}

	.send img.sendbtn{
		width: 100%;
		max-width: 400px;
	}

	.accordion{
		padding: 10px 0;
	}

	.accordion .detail{
		font-size: 13px;
		line-height: inherit;
	}

	.accordion .detail.big{
		font-size: 14px;
	}

	.accordion .detail span.highlight{
		font-size: 15px;
	}

	.accordion .detail font.headtxt{
		font-size: 18px;
	}

	.accordion .detail table.first th{
		line-height: 0;
	}


	.accordion .detail table.first th .group .item.s1.spec{
		padding-top: 0%;
	}

	.accordion .detail table.first th .group .item.s2{
	}

	.accordion .detail table.first td{
		font-size: 14px;
	}

	.accordion .detail table.first span.hstyle1{
		font-size: 24px;
	}

	.accordion .detail table.first span.hstyle2{
		font-size: 20px;
	}

	.accordion .detail table.first span.hstyle3{
		font-size: 18px;
	}

	.accordion .detail table.first span.hstyle4{
		font-size: 16px;
	}

	.accordion .detail .notice .item{
		width: 46px;
		float: left;
	}

	.accordion .detail .notice .description{
		width: calc(100% - 46px);
		float: left;
	}

	.accordion .detail table.second th{
		font-size: 16px;
	}

	.accordion .detail table.second td{
		font-size: 14px;
	}

	.accordion .detail .extra{
		font-size: 18px;
		line-height: initial;
	}

	footer{
		padding: 30px 10px 50px 10px;
	}

	footer ul{
		padding: 20px 0 10px 0;
	}

	footer ul li a{
		font-size: 3.5vw;
		letter-spacing: 0;
	}

	footer .copyright{

		padding: 2vw;
		font-size: 3.5vw;
		letter-spacing: 0.2vw;
	}

    .errortxt {
        font-size: 15px;
    }
}

/*小於等於480*/
@media (max-width: 480px) {
	.accordion .detail table.first th .group .item.s1.spec{
	}

	.accordion .detail table.first th .group .item.s2{
	}
}

/*小於等於380*/
@media (max-width: 380px) {

	.info .title{
		font-size: 20px;
	}

	.info span.extra{
		font-size: 16px;
		line-height: 25px;
	}

	.send{
		padding: 30px 5% 20px 5%;
	}
}

/*小於等於320*/
@media (max-width: 320px) {

	.info .title{
		font-size: 18px;
	}

	.info .group .childcol input[type=checkbox] + span{
		padding-left: 21px;
		background: url(../images/Agree.png) no-repeat;
		background-size: 20px auto;
		font-size: 18px;
		min-height: 30px;
	}

	.info .group.spec input[type=radio] + span{
		font-size: 18px;
	}

	.info .competition .team.team-category-1 span.title{
		font-size: 18px;
	}

	.info .competition .team.team-category-1 span.title{
		width: 100px;
	}

	.info .competition .team.team-category-1 .object{
		width: calc(100% - 100px);
	}

	.info .competition .team.team-category-3 span.title{
		width: 130px;
		font-size: 18px;
	}

	.info .competition .team .object input[type=text]{
		font-size: 18px;
		min-height: 35px;
	}

	.info .group input[type=radio] + span{
		font-size: 18px;
	}

	.info .competition .team .object select{
		font-size: 18px;
	}

	.info .competition .team.team-category-1 .extra{
		width: 100%;
	}

	.info .competition .team.team-category-1 .extra a{
		font-size: 16px;
	}

	.info .competition .team.team-category-3 .object{
		width: calc(100% - 130px);
	}

	.info .competition .team.team-category-3 .object input{
		min-height: 35px;
	}

	.info .judge input[type=checkbox] + span{
		background: url(../images/Agree.png) no-repeat;
		background-size: 30px auto;
		padding-left:  35px;
	}

	.send{
		padding: 30px 5% 20px 5%;
	}
}

