@charset "UTF-8";
/* CSS Document */
/*Theme Name: HADCプレ*/
/* =============================================
share
================================================ */
body { min-width: 1280px; }

.pc { display: block; }

.mb { display: none; }

a { color: #007327; text-decoration: none; }

a:hover { text-decoration: underline; }

a img { -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; }

a:hover img { opacity: 0.6; filter: alpha(opacity=60); }

.center { margin: 0 auto; width: 900px; }

/*header*/
header { padding: 20px 0 0; position: relative; }

/*footer*/
footer { padding: 0 0 40px; text-align: center; color: #007327; }
footer nav { margin-bottom: 20px; }
footer small { font-size: 70%; }

/*nav*/
nav { text-align: center; }
nav div { display: inline-block; }
nav a { position: relative; display: block; color: #007327; padding: 20px; }
nav a::before, nav a::after { position: absolute; opacity: 0; }
nav a::before { content: '"'; left: 10px; }
nav a::after { content: '"'; right: 10px; }
nav a:hover { text-decoration: none; }
nav a:hover::before, nav a:hover::after { opacity: 1; }
nav .sns { position: absolute; right: 20px; }
nav .sns a { display: inline; padding: 0 10px; }
nav .sns a::before, nav .sns a::after { display: none; }

#toTop { position: fixed; width: 75px; height: 75px; border: solid 1px #007327; background: rgba(255, 255, 255, 0.5); right: 30px; bottom: 30px; }
#toTop a { display: block; position: relative; height: 100%; }
#toTop a:after { content: ""; display: block; position: absolute; border-left: solid 3px #007327; border-top: solid 3px #007327; transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); width: 25px; height: 25px; left: 50%; top: 50%; margin-left: -13px; margin-top: -8px; }

section { color: #007327; padding: 50px 0; }

/* =============================================
competition
================================================ */
.page_title { text-align: center; font-size: 150%; font-weight: bold; margin-bottom: 50px; line-height: 130%; }

.page_nav { text-align: right; }
.page_nav li { width: 180px; margin-left: 10px; }
.page_nav li a { padding: 15px 0 35px; }

.page_copy { margin: 50px auto; font-size: 180%; }

.box_btn li { display: inline-block; border: solid 1px #007327; text-align: center; }

.box_btn .nolink, .box_btn li a { display: block; width: 100%; text-decoration: none; position: relative; }
.box_btn .nolink:after, .box_btn li a:after { content: ""; display: block; position: absolute; width: 10px; height: 10px; border-left: solid 5px #007327; border-bottom: solid 5px #007327; left: 50%; margin-left: -5px; bottom: 15px; transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); }
.box_btn .nolink::before, .box_btn li a::before { content: ""; display: block; position: absolute; width: 100%; top: 0; height: 100%; z-index: -1; background: #F19DB2; transform: scale(0); -moz-transform: scale(0); -webkit-transform: scale(0); -o-transform: scale(0); -ms-transform: scale(0); }
.box_btn .nolink:hover::before, .box_btn li a:hover::before { transform: scale(1.1); -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); }

article { margin-bottom: 50px; }
article h1 { color: #007327; background: #F19DB2; display: inline-block; font-size: 200%; font-weight: bold; margin-bottom: 40px; transform: scaleY(0.8); -moz-transform: scaleY(0.8); -webkit-transform: scaleY(0.8); -o-transform: scaleY(0.8); -ms-transform: scaleY(0.8); }
article p, article li, article dd { line-height: 180%; }

/* =============================================
flow
================================================ */
#flow dt { font-weight: bold; }
#flow dd { margin: 10px auto 30px; padding-left: 30px; }
#flow p { margin-top: 20px; }
#flow ul { list-style: disc; margin-left: 20px; }
#flow a { font-weight: bold; }

/* =============================================
schedule
================================================ */
#schedule dt { display: inline-block; }
#schedule dd { display: inline-block; }

/* =============================================
entry
================================================ */
#entry h2 { margin: 30px auto; }
#entry p { text-align: center; margin-bottom: 20px; }
#entry b { font-weight: bold; display: block; text-align: center; font-size: 130%; line-height: 130%; margin-bottom: 10px; }
#entry b + p { margin-top: 40px; }
#entry .box_btn { text-align: center; margin: 30px auto 40px; }
#entry .box_btn li { width: 23%; font-size: 115%; margin: 0 0.5%; }
#entry .box_btn .nolink, #entry .box_btn li a { padding: 30px 0 55px; }
#entry .box_btn .nolink::after, #entry .box_btn li a::after { transform: rotate(-135deg); -moz-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -o-transform: rotate(-135deg); -ms-transform: rotate(-135deg); margin-left: -8px; bottom: 30px; }
#entry .box_btn .nolink { display: inline-block; }
#entry .box_btn .nolink:before { opacity: 0.8; background: white; transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); z-index: 2; }
#entry #category { margin-bottom: 30px; }
#entry #category li { transform: scaleY(0.9); -moz-transform: scaleY(0.9); -webkit-transform: scaleY(0.9); -o-transform: scaleY(0.9); -ms-transform: scaleY(0.9); }
#entry #category span { padding-left: 20px; font-size: 80%; margin-top: 5px; }

/* =============================================
dl
================================================ */
#dl ul { margin-bottom: 40px; }
#dl li { vertical-align: top; height: 220px; width: 23%; font-size: 115%; margin: 0 0.5%; position: relative; }
#dl li a { display: block; font-weight: bold; position: absolute; height: 72%; width: 100%; padding-top: 30%; }
#dl li::after { bottom: 30px; }
#dl li:last-child span:first-child { line-height: 130%; position: static; font-size: 70%; }
#dl span { display: block; font-size: 65%; position: absolute; width: 100%; text-align: center; bottom: 50px; }
