@charset "UTF-8";
/* CSS Document */

section, article, aside, footer, header, nav, h2 { display:block;}

body { padding:0; margin:0 auto; color: #fff; font-size:1em; font-weight: 300; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; background-color: #000; position: relative;}
img { border:0; display: block;}

html, body { height: 100%;}

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

div.brk { clear: both;}

div#content { clear: both; width: 100%; padding: 0;}

.top-nav-full { clear: both; width: 100%; padding: 5px 20px; box-sizing: border-box; background-color: #ff00c8; display: flex; justify-content: space-between; align-items: center;}
#gotocenter { width: 160px; color: #ff00c8; text-decoration: none; display: block;}
#gotocenter:focus { color: #fff; text-decoration: none;}
.top-nav-full ul { width: calc(100% - 160px); padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-end; align-items: center;}
.top-nav-full ul li { padding: 0; margin: 0 0 0 20px;}
.top-nav-full ul li a { color: #fff; text-decoration: none;}
.top-nav-full ul li a:hover { color: #000;}

#AN[accesskey] { line-height: 2rem; margin-top: 0.313rem;}
#AN:focus { border: 1px #fff solid; box-sizing: border-box;}
#AT[accesskey] { line-height: 2rem; margin-top: 0.313rem;}
#AT:focus { border: 1px #fff solid; box-sizing: border-box;}
#AP[accesskey] { line-height: 2rem; margin-top: 0.313rem;}
#AP:focus { border: 2px #fff solid;}


/************ video box ************/
.video-container { position:relative; padding-bottom:56.25%; padding-top:30px; width:100%; height: 0px; overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed { position:absolute; top:0; left:0; width:100%; height:100%;}


noscript { color: #414141; font-size: 1.1rem; font-weight: 500; line-height: 1.4em;}


.accessibility-logo { clear: both; width: 100%;}
.accessibility-logo img { margin: 30px auto 0 auto;}


span.border-line { padding: 5px 10px; font-weight: 500; border: 1px #fff solid;}

.about-content a { color: #fff; border-bottom: 1px #fff dashed; text-decoration: none;}
.about-content a:hover { color: #ccc; border-bottom: 1px #ccc dashed;}



@media screen and (min-width: 1370px) {

  /************ header + nav ************/

  header { width: 100%; padding: 0 80px; box-sizing: border-box; background-color: #ff00c8; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}

  nav#mo { display: none;}

  nav#pc { width: 1000px;}
  nav#pc ul.nav-list { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: center;}
  nav#pc ul.nav-list li { padding: 0; margin: 0 20px 0 0; position: relative;}
  nav#pc ul.nav-list li a.c1 { padding: 30px 10px; color: #fff; font-size: 1.1rem; line-height: 1em; text-decoration: none; display: block; cursor: pointer;}
  nav#pc ul.nav-list li span.c1 { padding: 30px 10px; color: #fff; font-size: 1.1rem; line-height: 1em; display: block; cursor: pointer;}
  nav#pc ul.nav-list li a.c1:hover { color: #000;}
  nav#pc ul.nav-list li span.c1:hover { color: #000;}
  nav#pc ul.nav-list li a.c1.sel { color: #000;}
  nav#pc ul.nav-list li span.c1.sel { color: #000;}
  nav#pc ul.nav-list li ul.popup { width: 180px; padding: 0; margin: 0; border-radius: 8px; background-color: #ff00c8; border: 1px #fff solid; box-sizing: border-box; list-style: none; display: none; position: absolute; top: 60px; left: calc(50% - 90px); z-index: 9999;}
  nav#pc ul.nav-list li ul.popup li { width: 100%; height: auto; padding: 0; margin: 0; text-align: center; border-bottom: 1px #fff solid; box-sizing: border-box;}
  nav#pc ul.nav-list li ul.popup li:last-child { border-bottom: 0;}
  nav#pc ul.nav-list li ul.popup li a.c2 { width: 100%; height: auto; padding: 15px 5px; color: #fff; font-size: 1.1em; text-decoration: none; box-sizing: border-box; display: block;}
  nav#pc ul.nav-list li ul.popup li a.c2:hover { color: #eee;}

  .top-social-lang { width: calc(100% - 1000px); display: flex; justify-content: flex-end; align-items: center;}
  .top-social-lang img.social-icon { width: 26px; height: auto; margin: 0 15px 0 0;}
  .top-social-lang img.language-icon { width: 26px; height: auto; margin: 0 0 0 30px;}

  .header-line { width: 100%; display: flex; justify-content: flex-end;}
  .header-line .line { width: 40%; border-bottom: 1px #ff00c8 solid; display: block;}


  /************ banner ************/

  h1 { clear: both; width: 100%; padding: 0; margin: 0; display: block;}

  .banner-box { width: 100%; overflow: hidden;}
  .banner-box img { width: 100%; height: auto;}


  /************ section #hp-content ************/

  section#hp-content { clear: both; width: 100%; padding: 0 calc(50% - 650px) 80px calc(50% - 650px); box-sizing: border-box;}

  .hp-column { clear: both; width: 100%; padding: 40px 0; border-bottom: 1px rgba(255,255,255,0.2) solid;}
  .hp-column:last-child { border-bottom: 0;}

  .sub-title { width: 100%; padding: 0 0 30px 0; display: flex; justify-content: flex-start; align-items: center; position: relative;}
  .sub-title img.icon { width: 40px; height: auto;}
  .sub-title h2.title { padding: 0 0 0 15px; color: #ff00c8; font-size: 2rem; font-weight: 400; line-height: 1em; box-sizing: border-box;}
  .sub-title .more-bt { width: 100px; text-align: right; position: absolute; top: 0; right: 0;}
  .sub-title .more-bt a { color: #ff00c8; font-size: 0.9rem; font-weight: 400; text-decoration: none;}
  .sub-title .more-bt a:hover { border-bottom: 1px #ff00c8 solid;}

  .news-list-table { clear: both; width: 100%;}
  .news-list-table .list-box { width: 100%; padding: 0 0 20px 0; font-size: 1.1rem; line-height: 1.4em; display: flex; justify-content: flex-start;}
  .news-list-table .list-box .date { width: 130px;}
  .news-list-table .list-box .title { width: calc(100% - 130px);}
  .news-list-table .list-box .title a { color: #fff; text-decoration: none;}
  .news-list-table .list-box .title a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}

  .about-content { width: 100%; font-size: 1.1rem; line-height: 2em;}
  .about-content img.about-pic { width: 400px; height: auto; margin: 0 0 0 60px; float: right;}  

  .hp-record-photos { width: 90%; padding: 20px 0 0 0; margin: 0 auto;}
  .hp-record-photos img { width: calc(100% - 20px); height: auto; margin: 0 10px;}


  /************ page-breadcrumbs ************/

  .page-breadcrumbs { clear: both; width: 100%; padding: 0 0 20px 0; color: #ccc; font-size: 0.9rem; line-height: 1.2em;}
  .page-breadcrumbs a { color: #ccc; text-decoration: none;}
  .page-breadcrumbs a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}


  /************ section #page-about ************/

  section#page-about { clear: both; width: 100%; padding: 40px calc(50% - 650px) 80px calc(50% - 650px); box-sizing: border-box;}

  .page-title { font-size: 1.6rem; font-weight: 600;}


  /************ news-content ************/

  .page-news-content { clear: both; width: 100%; font-size: 1.1rem; line-height: 1.8em;}
  .page-news-content a { color: #fff; text-decoration: none; border-bottom: 1px #fff dashed;}
  .page-news-content img { max-width: 100%; height: auto;}
  .page-news-content .news-title { width: 100%; padding: 0 0 10px 0; font-size: 1.6rem; font-weight: 500; line-height: 1.2em;}
  .page-news-content .news-date { width: 100%; padding: 0 0 20px 0; margin: 0 0 30px 0; font-size: 1rem; border-bottom: 1px rgba(255,255,255,0.2) solid;}

  .goback-bt { clear: both; width: 100%; margin: 60px 0 0 0; text-align: center;}
  input[type=button] { width: 140px; padding: 8px 0; color: #fff; font-size: 1.1rem; font-weight: 400; border: 0; border-radius: 20px; background-color: #ff00c8; cursor: pointer;}


  /************ winner-content ************/

  .winner-content { clear: both; width: 100%;}

  .coming-soon { clear: both; width: 100%; padding: 80px 0; font-size: 2rem; line-height: 1.6em; text-align: center;}
  
  .winner-nav { clear: both; width: 100%; margin: 20px 0;}
  .winner-nav ul.win-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  .winner-nav ul.win-nav li { padding: 0; margin: 0 10px 20px 10px;}
  .winner-nav ul.win-nav li a { padding: 10px 30px; border: 1px #fff solid; border-radius: 10px; color: #fff; font-size: 1.6em; font-weight: 300; background-color: #000; text-decoration: none; display: block;}
  .winner-nav ul.win-nav li a:hover { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}
  .winner-nav ul.win-nav li a.sel { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}

  ul.win-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.win-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.win-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.win-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.win-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .win-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}
  
  .page-text-winner { width: 100%; padding: 30px 0 0 0;}
  .page-text-winner .winner-title { width: 100%; margin: 0 0 40px 0; font-size: 2em; font-weight: 600; line-height: 2.2em;}
  .page-text-winner .title { width: 100%; margin: 0 0 30px 0; font-size: 1.6em; font-weight: 300;}
  .page-text-winner .title-class { width: 100%; padding: 0 0 0 15px; margin: 0 0 20px 0; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box { width: 100%; margin: 0 0 30px 0;}
  .page-text-winner .items-box .items-caption { width: 100%; padding: 0 0 15px 20px; color: #ff00c8; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box .items-column { width: 100%; padding: 0 0 0 50px; font-size: 1.2em; font-weight: 300; line-height: 1.6em; box-sizing: border-box;}
  .page-text-winner .link {color:#ffffff; padding: 10px 30px; border: 1px #ff00c8 solid; border-radius: 10px;font-size: 1.25rem; background-color: #ff00c8;} 
  .page-text-winner .winner-title .link:hover{color:#ff00c8; border-color:#ff00c8; background-color: transparent;}


  /************ history-content ************/

  ul.photos-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.photos-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.photos-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.photos-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.photos-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .photos-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}

  .page-text-history .title { width: 100%; padding: 0 0 5px 0; margin: 0 0 30px 0; font-size: 1.8em; font-weight: 300; border-bottom: 1px #fff solid;}
  .page-text-history .photos-list-box { width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page-text-history .photo { width: calc(100% / 4 - 20px); margin: 0 10px 20px 10px;}
  .page-text-history .photo a { box-sizing: border-box; display: block;}
  .page-text-history .photo a img { width: 100%; height: auto;}
  .page-text-history .photo a img.v { width: 100%; height: auto;}


  /************ sitemap-content ************/

  .sitemap-content { clear: both; width: 100%; padding: 80px 0; box-sizing: border-box;}
  .sitemap-content ul.sitemap { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .sitemap-content ul.sitemap li { padding: 0; margin: 0 20px 40px 20px; color: #fff; font-size: 1.2rem; font-weight: 500; line-height: 1.2em;}
  .sitemap-content ul.sitemap li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li a:hover { color: #ff00c8;}
  .sitemap-content ul.sitemap li ul.sitemap-up { padding: 15px 0; margin: 10px 0 0 0; border-top: 1px #999 solid; list-style: none; display: block;}
  .sitemap-content ul.sitemap li ul.sitemap-up li { padding: 0; margin: 0 0 10px 0; font-size: 1.1rem; font-weight: 300; line-height: 1.2em; text-align: center;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a:hover { color: #ff00c8;}


  /************ footer ************/

  footer { clear: both; width: 100%; padding: 40px 80px; box-sizing: border-box; border-top: 1px rgba(255,255,255,0.2) solid;}

  footer .support-corp-list { width: 100%; margin: 0 0 20px 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  footer .support-corp-list div { margin: 0 20px 0 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  footer .support-corp-list div span.title { padding: 5px 10px; color: #fff; font-size: 1rem; line-height: 1em; border-right: 1px #fff solid; white-space: nowrap;}
  footer .support-corp-list div img.logo-1 { width: auto; height: 40px; margin: 10px;}
  footer .support-corp-list div img.logo-2-1 { width: auto; height: 30px; margin: 10px;}
  footer .support-corp-list div img.logo-2-2 { width: auto; height: 30px; margin: 10px 10px 10px 0;}
  footer .support-corp-list div img.logo-3 { width: auto; height: 44px; margin: 10px;}
  footer .support-corp-list div img.logo-4 { width: auto; height: 30px; margin: 10px;}
  footer .support-corp-list div img.logo-5 { width: auto; height: 18px; margin: 10px;}
  footer .support-corp-list div img.logo-7 { width: auto; height: 24px; margin: 10px;}
  footer .support-corp-list div img.logo-11 { width: auto; height: 16px; margin: 10px;}
  footer .support-corp-list div img.logo-12 { width: auto; height: 28px; margin: 10px;}
  footer .support-corp-list div img.logo-13 { width: auto; height: 22px; margin: 10px;}

  .footer-logo-list { display: flex; justify-content: center !important; align-items: center !important; flex-wrap: wrap;}


}

@media screen and (min-width: 1024px) and (max-width: 1369px) {

  /************ header + nav ************/

  header { width: 100%; padding: 0 40px; box-sizing: border-box; background-color: #ff00c8; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}

  nav#mo { display: none;}

  nav#pc { display: block;}
  nav#pc ul.nav-list { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: center;}
  nav#pc ul.nav-list li { padding: 0; margin: 0; position: relative;}
  nav#pc ul.nav-list li a.c1 { padding: 30px 10px; color: #fff; font-size: 1.1rem; line-height: 1em; text-decoration: none; display: block; cursor: pointer;}
  nav#pc ul.nav-list li span.c1 { padding: 30px 10px; color: #fff; font-size: 1.1rem; line-height: 1em; text-decoration: none; display: block; cursor: pointer;}
  nav#pc ul.nav-list li a.c1:hover { color: #000;}
  nav#pc ul.nav-list li span.c1:hover { color: #000;}
  nav#pc ul.nav-list li a.c1.sel { color: #000;}
  nav#pc ul.nav-list li span.c1.sel { color: #000;}
  nav#pc ul.nav-list li ul.popup { width: 180px; padding: 0; margin: 0; border-radius: 8px; background-color: #ff00c8; border: 1px #fff solid; box-sizing: border-box; list-style: none; display: none; position: absolute; top: 60px; left: calc(50% - 90px); z-index: 9999;}
  nav#pc ul.nav-list li ul.popup li { width: 100%; height: auto; padding: 0; margin: 0; text-align: center; border-bottom: 1px #fff solid; box-sizing: border-box;}
  nav#pc ul.nav-list li ul.popup li:last-child { border-bottom: 0;}
  nav#pc ul.nav-list li ul.popup li a.c2 { width: 100%; height: auto; padding: 15px 5px; color: #fff; font-size: 1.1em; text-decoration: none; box-sizing: border-box; display: block;}
  nav#pc ul.nav-list li ul.popup li a.c2:hover { color: #eee;}

  .top-social-lang { display: flex; justify-content: flex-end; align-items: center;}
  .top-social-lang img.social-icon { width: 26px; height: auto; margin: 0 15px 0 0;}
  .top-social-lang img.language-icon { width: 26px; height: auto; margin: 0 0 0 30px;}

  .header-line { width: 100%; display: flex; justify-content: flex-end;}
  .header-line .line { display: none;}


  /************ banner ************/

  h1 { clear: both; width: 100%; padding: 0; margin: 0; display: block;}

  .banner-box { clear: both; width: 100%; overflow: hidden;}
  .banner-box img { width: 100%; height: auto;}


  /************ section #hp-content ************/

  section#hp-content { clear: both; width: 100%; padding: 0 40px 80px 40px; box-sizing: border-box;}

  .hp-column { clear: both; width: 100%; padding: 40px 0; border-bottom: 1px rgba(255,255,255,0.2) solid;}
  .hp-column:last-child { border-bottom: 0;}

  .sub-title { width: 100%; padding: 0 0 30px 0; display: flex; justify-content: flex-start; align-items: center; position: relative;}
  .sub-title img.icon { width: 40px; height: auto;}
  .sub-title h2.title { padding: 0 0 0 15px; color: #ff00c8; font-size: 2rem; font-weight: 400; line-height: 1em; box-sizing: border-box;}
  .sub-title .more-bt { width: 100px; text-align: right; position: absolute; top: 0; right: 0;}
  .sub-title .more-bt a { color: #ff00c8; font-size: 0.9rem; font-weight: 400; text-decoration: none;}
  .sub-title .more-bt a:hover { border-bottom: 1px #ff00c8 solid;}

  .news-list-table { clear: both; width: 100%;}
  .news-list-table .list-box { width: 100%; padding: 0 0 20px 0; font-size: 1.1rem; line-height: 1.4em; display: flex; justify-content: flex-start;}
  .news-list-table .list-box .date { width: 130px;}
  .news-list-table .list-box .title { width: calc(100% - 130px);}
  .news-list-table .list-box .title a { color: #fff; text-decoration: none;}
  .news-list-table .list-box .title a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}

  .about-content { width: 100%; font-size: 1.1rem; line-height: 2em;}
  .about-content img.about-pic { width: 400px; height: auto; margin: 0 0 0 60px; float: right;}

  .hp-record-photos { width: 90%; padding: 20px 0 0 0; margin: 0 auto;}
  .hp-record-photos img { width: calc(100% - 20px); height: auto; margin: 0 10px;}


  /************ page-breadcrumbs ************/

  .page-breadcrumbs { clear: both; width: 100%; padding: 0 0 20px 0; color: #ccc; font-size: 0.9rem; line-height: 1.2em;}
  .page-breadcrumbs a { color: #ccc; text-decoration: none;}
  .page-breadcrumbs a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}


  /************ section #page-about ************/

  section#page-about { clear: both; width: 100%; padding: 40px 40px 80px 40px; box-sizing: border-box;}

  .page-title { font-size: 1.6rem; font-weight: 600;}


  /************ news-content ************/

  .page-news-content { clear: both; width: 100%; font-size: 1.1rem; line-height: 1.8em;}
  .page-news-content a { color: #fff; text-decoration: none; border-bottom: 1px #fff dashed;}
  .page-news-content img { max-width: 100%; height: auto;}
  .page-news-content .news-title { width: 100%; padding: 0 0 10px 0; font-size: 1.6rem; font-weight: 500; line-height: 1.2em;}
  .page-news-content .news-date { width: 100%; padding: 0 0 20px 0; margin: 0 0 30px 0; font-size: 1rem; border-bottom: 1px rgba(255,255,255,0.2) solid;}

  .goback-bt { clear: both; width: 100%; margin: 60px 0 0 0; text-align: center;}
  input[type=button] { width: 140px; padding: 8px 0; color: #fff; font-size: 1.1rem; font-weight: 400; border: 0; border-radius: 20px; background-color: #ff00c8; cursor: pointer;}


  /************ winner-content ************/

  .winner-content { clear: both; width: 100%;}

  .coming-soon { clear: both; width: 100%; padding: 80px 0; font-size: 2rem; line-height: 1.6em; text-align: center;}
  
  .winner-nav { clear: both; width: 100%; margin: 20px 0;}
  .winner-nav ul.win-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  .winner-nav ul.win-nav li { padding: 0; margin: 0 10px 20px 10px;}
  .winner-nav ul.win-nav li a { padding: 10px 30px; border: 1px #fff solid; border-radius: 10px; color: #fff; font-size: 1.6em; font-weight: 300; background-color: #000; text-decoration: none; display: block;}
  .winner-nav ul.win-nav li a:hover { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}
  .winner-nav ul.win-nav li a.sel { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}

  ul.win-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.win-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.win-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.win-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.win-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .win-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}
  
  .page-text-winner { width: 100%; padding: 30px 0 0 0;}
  .page-text-winner .winner-title { width: 100%; margin: 0 0 40px 0; font-size: 2em; font-weight: 600; line-height: 2.2em;}
  .page-text-winner .title { width: 100%; margin: 0 0 30px 0; font-size: 1.6em; font-weight: 300;}
  .page-text-winner .title-class { width: 100%; padding: 0 0 0 15px; margin: 0 0 20px 0; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box { width: 100%; margin: 0 0 30px 0;}
  .page-text-winner .items-box .items-caption { width: 100%; padding: 0 0 15px 20px; color: #ff00c8; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box .items-column { width: 100%; padding: 0 0 0 50px; font-size: 1.2em; font-weight: 300; line-height: 1.6em; box-sizing: border-box;}
  .page-text-winner .link {color:#ffffff; padding: 10px 30px; border: 1px #ff00c8 solid; border-radius: 10px;font-size: 1.25rem; background-color: #ff00c8;} 
  .page-text-winner .winner-title .link:hover{color:#ff00c8; border-color:#ff00c8; background-color: transparent;}


  /************ history-content ************/

  ul.photos-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.photos-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.photos-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.photos-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.photos-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .photos-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}

  .page-text-history .title { width: 100%; padding: 0 0 5px 0; margin: 0 0 30px 0; font-size: 1.8em; font-weight: 300; border-bottom: 1px #fff solid;}
  .page-text-history .photos-list-box { width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page-text-history .photo { width: calc(100% / 4 - 20px); margin: 0 10px 20px 10px;}
  .page-text-history .photo a { box-sizing: border-box; display: block;}
  .page-text-history .photo a img { width: 100%; height: auto;}
  .page-text-history .photo a img.v { width: 100%; height: auto;}


  /************ sitemap-content ************/

  .sitemap-content { clear: both; width: 100%; padding: 80px 0; box-sizing: border-box;}
  .sitemap-content ul.sitemap { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .sitemap-content ul.sitemap li { padding: 0; margin: 0 20px 40px 20px; color: #fff; font-size: 1.2rem; font-weight: 500; line-height: 1.2em;}
  .sitemap-content ul.sitemap li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li a:hover { color: #ff00c8;}
  .sitemap-content ul.sitemap li ul.sitemap-up { padding: 15px 0; margin: 10px 0 0 0; border-top: 1px #999 solid; list-style: none; display: block;}
  .sitemap-content ul.sitemap li ul.sitemap-up li { padding: 0; margin: 0 0 10px 0; font-size: 1.1rem; font-weight: 300; line-height: 1.2em; text-align: center;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a:hover { color: #ff00c8;}


  /************ footer ************/

  footer { clear: both; width: 100%; padding: 40px 80px; box-sizing: border-box; border-top: 1px rgba(255,255,255,0.2) solid;}

  footer .support-corp-list { width: 100%; margin: 0 0 20px 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  footer .support-corp-list div { margin: 0 20px 0 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  footer .support-corp-list div span.title { padding: 5px 10px; color: #fff; font-size: 1rem; line-height: 1em; border-right: 1px #fff solid; white-space: nowrap;}
  footer .support-corp-list div img.logo-1 { width: auto; height: 40px; margin: 10px;}
  footer .support-corp-list div img.logo-2-1 { width: auto; height: 30px; margin: 10px;}
  footer .support-corp-list div img.logo-2-2 { width: auto; height: 30px; margin: 10px 10px 10px 0;}
  footer .support-corp-list div img.logo-3 { width: auto; height: 44px; margin: 10px;}
  footer .support-corp-list div img.logo-4 { width: auto; height: 30px; margin: 10px;}
  footer .support-corp-list div img.logo-5 { width: auto; height: 18px; margin: 10px;}
  footer .support-corp-list div img.logo-7 { width: auto; height: 24px; margin: 10px;}
  footer .support-corp-list div img.logo-11 { width: auto; height: 16px; margin: 10px;}
  footer .support-corp-list div img.logo-12 { width: auto; height: 28px; margin: 10px;}
  footer .support-corp-list div img.logo-13 { width: auto; height: 22px; margin: 10px;}

  .footer-logo-list { display: flex; justify-content: center !important; align-items: center !important; flex-wrap: wrap;}


}

@media screen and (min-width: 768px) and (max-width: 1023px) {

  /************ header + nav ************/

  header { width: 100%; padding: 0 40px; box-sizing: border-box; background-color: #ff00c8; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}

  nav#pc { display: none;}

  nav#mo { display: block; position: relative;}
  nav#mo .nav-icon { width: 40px; color: #fff; font-size: 2em; text-align: center; cursor: pointer;}
  nav#mo ul.nav-list { width: 320px; padding: 20px 40px 40px 40px; margin: 0; list-style: none; background-color: #ff00c8; box-sizing: border-box; display: none; position: absolute; top: 0; left: -360px; z-index: 9999;}
  nav#mo ul.nav-list .nav-close { width: 100%; margin: -20px 0 0 -20px; color: #fff; font-size: 3em; text-align: left; cursor: pointer;}
  nav#mo ul.nav-list li { width: 100%; padding: 0; margin: 0; border-bottom: 1px rgba(255,255,255,0.2) solid;}
  nav#mo ul.nav-list li:last-child { border-bottom: 0;}
  nav#mo ul.nav-list li a.c1 { width: 100%; padding: 20px 10px; color: #fff; font-size: 1.1rem; line-height: 1em; text-decoration: none; display: block; box-sizing: border-box; cursor: pointer;}
  nav#mo ul.nav-list li ul.popup { width: 100%; padding: 0; margin: 0; background-color: rgba(255,255,255,0.6); list-style: none; display: none;}
  nav#mo ul.nav-list li ul.popup li { width: 100%; height: auto; padding: 0; margin: 0; text-align: center; border-bottom: 1px #ff00c8 solid; box-sizing: border-box;}
  nav#mo ul.nav-list li ul.popup li:last-child { border-bottom: 0;}
  nav#mo ul.nav-list li ul.popup li a.c2 { width: 100%; height: auto; padding: 15px 5px; color: #000; font-size: 1.1em; text-decoration: none; box-sizing: border-box; display: block;}

  .top-social-lang { display: flex; justify-content: flex-end; align-items: center;}
  .top-social-lang img.social-icon { width: 26px; height: auto; margin: 0 15px 0 0;}
  .top-social-lang img.language-icon { width: 26px; height: auto; margin: 0 0 0 30px;}

  .header-line { width: 100%; display: flex; justify-content: flex-end;}
  .header-line .line { display: none;}


  /************ banner ************/

  h1 { clear: both; width: 100%; padding: 0; margin: 0; display: block;}

  .banner-box { clear: both; width: 100%; overflow: hidden;}
  .banner-box img { width: 100%; height: auto;}


  /************ section #hp-content ************/

  section#hp-content { clear: both; width: 100%; padding: 0 40px 80px 40px; box-sizing: border-box;}

  .hp-column { clear: both; width: 100%; padding: 40px 0; border-bottom: 1px rgba(255,255,255,0.2) solid;}
  .hp-column:last-child { border-bottom: 0;}

  .sub-title { width: 100%; padding: 0 0 30px 0; display: flex; justify-content: flex-start; align-items: center; position: relative;}
  .sub-title img.icon { width: 40px; height: auto;}
  .sub-title h2.title { padding: 0 0 0 15px; color: #ff00c8; font-size: 2rem; font-weight: 400; line-height: 1em; box-sizing: border-box;}
  .sub-title .more-bt { width: 100px; text-align: right; position: absolute; top: 0; right: 0;}
  .sub-title .more-bt a { color: #ff00c8; font-size: 0.9rem; font-weight: 400; text-decoration: none;}
  .sub-title .more-bt a:hover { border-bottom: 1px #ff00c8 solid;}

  .news-list-table { clear: both; width: 100%;}
  .news-list-table .list-box { width: 100%; padding: 0 0 20px 0; font-size: 1.1rem; line-height: 1.4em; display: flex; justify-content: flex-start;}
  .news-list-table .list-box .date { width: 130px;}
  .news-list-table .list-box .title { width: calc(100% - 130px);}
  .news-list-table .list-box .title a { color: #fff; text-decoration: none;}
  .news-list-table .list-box .title a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}

  .about-content { width: 100%; font-size: 1.1rem; line-height: 2em;}
  .about-content img.about-pic { width: 300px; height: auto; margin: 0 0 0 30px; float: right;}

  .hp-record-photos { width: 86%; padding: 20px 0 0 0; margin: 0 auto;}
  .hp-record-photos img { width: calc(100% - 20px); height: auto; margin: 0 10px;}


  /************ page-breadcrumbs ************/

  .page-breadcrumbs { clear: both; width: 100%; padding: 0 0 20px 0; color: #ccc; font-size: 0.9rem; line-height: 1.2em;}
  .page-breadcrumbs a { color: #ccc; text-decoration: none;}
  .page-breadcrumbs a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}


  /************ section #page-about ************/

  section#page-about { clear: both; width: 100%; padding: 40px 40px 80px 40px; box-sizing: border-box;}

  span.page-title { font-size: 1.6rem; font-weight: 600;}


  /************ news-content ************/

  .page-news-content { clear: both; width: 100%; font-size: 1.1rem; line-height: 1.8em;}
  .page-news-content a { color: #fff; text-decoration: none; border-bottom: 1px #fff dashed;}
  .page-news-content img { max-width: 100%; height: auto;}
  .page-news-content .news-title { width: 100%; padding: 0 0 10px 0; font-size: 1.6rem; font-weight: 500; line-height: 1.2em;}
  .page-news-content .news-date { width: 100%; padding: 0 0 20px 0; margin: 0 0 30px 0; font-size: 1rem; border-bottom: 1px rgba(255,255,255,0.2) solid;}

  .goback-bt { clear: both; width: 100%; margin: 60px 0 0 0; text-align: center;}
  input[type=button] { width: 140px; padding: 8px 0; color: #fff; font-size: 1.1rem; font-weight: 400; border: 0; border-radius: 20px; background-color: #ff00c8; cursor: pointer;}


  /************ winner-content ************/

  .winner-content { clear: both; width: 100%;}

  .coming-soon { clear: both; width: 100%; padding: 80px 0; font-size: 2rem; line-height: 1.6em; text-align: center;}
  
  .winner-nav { clear: both; width: 100%; margin: 20px 0;}
  .winner-nav ul.win-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  .winner-nav ul.win-nav li { padding: 0; margin: 0 10px 20px 10px;}
  .winner-nav ul.win-nav li a { padding: 10px 30px; border: 1px #fff solid; border-radius: 10px; color: #fff; font-size: 1.6em; font-weight: 300; background-color: #000; text-decoration: none; display: block;}
  .winner-nav ul.win-nav li a:hover { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}
  .winner-nav ul.win-nav li a.sel { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}

  ul.win-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.win-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.win-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.win-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.win-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .win-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}
  
  .page-text-winner { width: 100%; padding: 30px 0 0 0;}
  .page-text-winner .winner-title { width: 100%; margin: 0 0 40px 0; font-size: 2em; font-weight: 600; line-height: 2.2em;}
  .page-text-winner .title { width: 100%; margin: 0 0 30px 0; font-size: 1.6em; font-weight: 300;}
  .page-text-winner .title-class { width: 100%; padding: 0 0 0 15px; margin: 0 0 20px 0; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box { width: 100%; margin: 0 0 30px 0;}
  .page-text-winner .items-box .items-caption { width: 100%; padding: 0 0 15px 20px; color: #ff00c8; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box .items-column { width: 100%; padding: 0 0 0 50px; font-size: 1.2em; font-weight: 300; line-height: 1.6em; box-sizing: border-box;}
  .page-text-winner .link {color:#ffffff; padding: 10px 30px; border: 1px #ff00c8 solid; border-radius: 10px;font-size: 1.25rem; background-color: #ff00c8;} 
  .page-text-winner .winner-title .link:hover{color:#ff00c8; border-color:#ff00c8; background-color: transparent;}


  /************ history-content ************/

  ul.photos-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.photos-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.photos-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.photos-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.photos-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .photos-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}

  .page-text-history .title { width: 100%; padding: 0 0 5px 0; margin: 0 0 30px 0; font-size: 1.8em; font-weight: 300; border-bottom: 1px #fff solid;}
  .page-text-history .photos-list-box { width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page-text-history .photo { width: calc(100% / 3 - 20px); margin: 0 10px 20px 10px;}
  .page-text-history .photo a { box-sizing: border-box; display: block;}
  .page-text-history .photo a img { width: 100%; height: auto;}
  .page-text-history .photo a img.v { width: 100%; height: auto;}


  /************ sitemap-content ************/

  .sitemap-content { clear: both; width: 100%; padding: 80px 0; box-sizing: border-box;}
  .sitemap-content ul.sitemap { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap;}
  .sitemap-content ul.sitemap li { padding: 0; margin: 0 20px 40px 20px; color: #fff; font-size: 1.2rem; font-weight: 500; line-height: 1.2em;}
  .sitemap-content ul.sitemap li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li a:hover { color: #ff00c8;}
  .sitemap-content ul.sitemap li ul.sitemap-up { padding: 15px 0; margin: 10px 0 0 0; border-top: 1px #999 solid; list-style: none; display: block;}
  .sitemap-content ul.sitemap li ul.sitemap-up li { padding: 0; margin: 0 0 10px 0; font-size: 1.1rem; font-weight: 300; line-height: 1.2em; text-align: center;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a:hover { color: #ff00c8;}


  /************ footer ************/

  footer { clear: both; width: 100%; padding: 40px 80px; box-sizing: border-box; border-top: 1px rgba(255,255,255,0.2) solid;}

  footer .support-corp-list { width: 100%; margin: 0 0 20px 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  footer .support-corp-list div { margin: 0 20px 0 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  footer .support-corp-list div span.title { padding: 5px 10px; color: #fff; font-size: 1rem; line-height: 1em; border-right: 1px #fff solid; white-space: nowrap;}  
  footer .support-corp-list div img.logo-1 { width: auto; height: 40px; margin: 10px;}
  footer .support-corp-list div img.logo-2-1 { width: auto; height: 30px; margin: 10px;}
  footer .support-corp-list div img.logo-2-2 { width: auto; height: 30px; margin: 10px 10px 10px 0;}
  footer .support-corp-list div img.logo-3 { width: auto; height: 44px; margin: 10px;}
  footer .support-corp-list div img.logo-4 { width: auto; height: 30px; margin: 10px;}
  footer .support-corp-list div img.logo-5 { width: auto; height: 18px; margin: 10px;}
  footer .support-corp-list div img.logo-7 { width: auto; height: 24px; margin: 10px;}
  footer .support-corp-list div img.logo-11 { width: auto; height: 16px; margin: 10px;}
  footer .support-corp-list div img.logo-12 { width: auto; height: 28px; margin: 10px;}
  footer .support-corp-list div img.logo-13 { width: auto; height: 22px; margin: 10px;}


}

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

  /************ header + nav ************/

  header { width: 100%; padding: 0 20px; box-sizing: border-box; background-color: #ff00c8; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}

  nav#pc { display: none;}

  nav#mo { display: block; position: relative;}
  nav#mo .nav-icon { width: 40px; color: #fff; font-size: 2em; text-align: center; cursor: pointer;}
  nav#mo ul.nav-list { width: 320px; padding: 20px 40px 40px 60px; margin: 0; list-style: none; background-color: #ff00c8; box-sizing: border-box; display: none; position: absolute; top: 0; left: -340px; z-index: 9999;}
  nav#mo ul.nav-list .nav-close { width: 100%; margin: -20px 0 0 -20px; color: #fff; font-size: 3em; text-align: left; cursor: pointer;}
  nav#mo ul.nav-list li { width: 100%; padding: 0; margin: 0; border-bottom: 1px rgba(255,255,255,0.2) solid;}
  nav#mo ul.nav-list li:last-child { border-bottom: 0;}
  nav#mo ul.nav-list li a.c1 { width: 100%; padding: 20px 10px; color: #fff; font-size: 1.1rem; line-height: 1em; text-decoration: none; display: block; box-sizing: border-box; cursor: pointer;}
  nav#mo ul.nav-list li ul.popup { width: 100%; padding: 0; margin: 0; background-color: rgba(255,255,255,0.6); list-style: none; display: none;}
  nav#mo ul.nav-list li ul.popup li { width: 100%; height: auto; padding: 0; margin: 0; text-align: center; border-bottom: 1px #ff00c8 solid; box-sizing: border-box;}
  nav#mo ul.nav-list li ul.popup li:last-child { border-bottom: 0;}
  nav#mo ul.nav-list li ul.popup li a.c2 { width: 100%; height: auto; padding: 15px 5px; color: #000; font-size: 1.1em; text-decoration: none; box-sizing: border-box; display: block;}

  .top-social-lang { display: flex; justify-content: flex-end; align-items: center;}
  .top-social-lang img.social-icon { width: 26px; height: auto; margin: 0 15px 0 0;}
  .top-social-lang img.language-icon { width: 26px; height: auto; margin: 0 0 0 30px;}

  .header-line { width: 100%; display: flex; justify-content: flex-end;}
  .header-line .line { display: none;}


  /************ banner ************/

  h1 { clear: both; width: 100%; padding: 0; margin: 0; display: block;}

  .banner-box { clear: both; width: 100%; overflow: hidden;}
  .banner-box img { width: 100%; height: auto;}


  /************ section #hp-content ************/

  section#hp-content { clear: both; width: 100%; padding: 0 20px 80px 20px; box-sizing: border-box;}

  .hp-column { clear: both; width: 100%; padding: 40px 0; border-bottom: 1px rgba(255,255,255,0.2) solid;}
  .hp-column:last-child { border-bottom: 0;}

  .sub-title { width: 100%; padding: 0 0 30px 0; display: flex; justify-content: flex-start; align-items: center; position: relative;}
  .sub-title img.icon { width: 40px; height: auto;}
  .sub-title h2.title { padding: 0 0 0 15px; color: #ff00c8; font-size: 2rem; font-weight: 400; line-height: 1em; box-sizing: border-box;}
  .sub-title .more-bt { width: 100px; text-align: right; position: absolute; top: 0; right: 0;}
  .sub-title .more-bt a { color: #ff00c8; font-size: 0.9rem; font-weight: 400; text-decoration: none;}
  .sub-title .more-bt a:hover { border-bottom: 1px #ff00c8 solid;}

  .news-list-table { clear: both; width: 100%;}
  .news-list-table .list-box { width: 100%; padding: 0 0 20px 0; font-size: 1.1rem; line-height: 1.4em;}
  .news-list-table .list-box .date { width: 100%; padding: 0 0 10px 0;}
  .news-list-table .list-box .title { width: 100%;}
  .news-list-table .list-box .title a { color: #fff; text-decoration: none;}
  .news-list-table .list-box .title a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}

  .about-content { width: 100%; font-size: 1.1rem; line-height: 2em;}
  .about-content img.about-pic { width: 100%; height: auto; margin: 0 0 30px 0;}

  .hp-record-photos { width: 80%; padding: 20px 0 0 0; margin: 0 auto;}
  .hp-record-photos img { width: 100%; height: auto;}


  /************ page-breadcrumbs ************/

  .page-breadcrumbs { clear: both; width: 100%; padding: 0 0 20px 0; color: #ccc; font-size: 0.9rem; line-height: 1.2em;}
  .page-breadcrumbs a { color: #ccc; text-decoration: none;}
  .page-breadcrumbs a:hover { color: #ff00c8; border-bottom: 1px #ff00c8 solid;}


  /************ section #page-about ************/

  section#page-about { clear: both; width: 100%; padding: 40px 20px 80px 20px; box-sizing: border-box;}

  span.page-title { font-size: 1.6rem; font-weight: 600;}


  /************ news-content ************/

  .page-news-content { clear: both; width: 100%; font-size: 1.1rem; line-height: 1.8em;}
  .page-news-content a { color: #fff; text-decoration: none; border-bottom: 1px #fff dashed;}
  .page-news-content img { max-width: 100%; height: auto;}
  .page-news-content .news-title { width: 100%; padding: 0 0 10px 0; font-size: 1.6rem; font-weight: 500; line-height: 1.2em;}
  .page-news-content .news-date { width: 100%; padding: 0 0 20px 0; margin: 0 0 30px 0; font-size: 1rem; border-bottom: 1px rgba(255,255,255,0.2) solid;}

  .goback-bt { clear: both; width: 100%; margin: 60px 0 0 0; text-align: center;}
  input[type=button] { width: 140px; padding: 8px 0; color: #fff; font-size: 1.1rem; font-weight: 400; border: 0; border-radius: 20px; background-color: #ff00c8; cursor: pointer;}


  /************ winner-content ************/

  .winner-content { clear: both; width: 100%;}

  .coming-soon { clear: both; width: 100%; padding: 80px 0; font-size: 2rem; line-height: 1.6em; text-align: center;}
  
  .winner-nav { clear: both; width: 100%; margin: 20px 0;}
  .winner-nav ul.win-nav { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  .winner-nav ul.win-nav li { padding: 0; margin: 0 10px 20px 10px;}
  .winner-nav ul.win-nav li a { padding: 10px 30px; border: 1px #fff solid; border-radius: 10px; color: #fff; font-size: 1.6em; font-weight: 300; background-color: #000; text-decoration: none; display: block;}
  .winner-nav ul.win-nav li a:hover { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}
  .winner-nav ul.win-nav li a.sel { color: #ff00c8; font-weight: 400; border: 1px #ff00c8 solid; background-color: #000;}

  ul.win-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.win-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.win-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.win-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.win-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .win-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}
  
  .page-text-winner { width: 100%; padding: 30px 0 0 0;}
  .page-text-winner .winner-title { width: 100%; margin: 0 0 40px 0; font-size: 2em; font-weight: 600; line-height: 2.2em;}
  .page-text-winner .title { width: 100%; margin: 0 0 30px 0; font-size: 1.6em; font-weight: 300;}
  .page-text-winner .title-class { width: 100%; padding: 0 0 0 15px; margin: 0 0 20px 0; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box { width: 100%; margin: 0 0 30px 0;}
  .page-text-winner .items-box .items-caption { width: 100%; padding: 0 0 15px 20px; color: #ff00c8; font-size: 1.4em; font-weight: 300; box-sizing: border-box;}
  .page-text-winner .items-box .items-column { width: 100%; padding: 0 0 0 50px; font-size: 1.2em; font-weight: 300; line-height: 1.6em; box-sizing: border-box;}
  .page-text-winner .link {color:#ffffff; padding: 10px 30px; border: 1px #ff00c8 solid; border-radius: 10px;font-size: 1.25rem; background-color: #ff00c8;} 
  .page-text-winner .winner-title .link:hover{color:#ff00c8; border-color:#ff00c8; background-color: transparent;}


  /************ history-content ************/

  ul.photos-history-tab { clear: both; width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
  ul.photos-history-tab li { padding: 0; margin: 0 5px 10px 5px;}
  ul.photos-history-tab li a { padding: 8px 10px; color: #fff; font-size: 1rem; line-height: 1em; text-decoration: none; border: 1px #fff solid; border-radius: 8px; display: block;}
  ul.photos-history-tab li a:hover { color: #ff00c8; border: 1px #ff00c8 solid;}
  ul.photos-history-tab li a.sel { color: #ff00c8; border: 1px #ff00c8 solid;}

  .photos-history-tab-content { clear: both; width: 100%; margin: 30px 0 0 0;}

  .page-text-history .title { width: 100%; padding: 0 0 5px 0; margin: 0 0 30px 0; font-size: 1.8em; font-weight: 300; border-bottom: 1px #fff solid;}
  .page-text-history .photos-list-box { width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap;}
  .page-text-history .photo { width: calc(100% / 2 - 20px); margin: 0 10px 20px 10px;}
  .page-text-history .photo a { box-sizing: border-box; display: block;}
  .page-text-history .photo a img { width: 100%; height: auto;}
  .page-text-history .photo a img.v { width: 100%; height: auto;}


  /************ sitemap-content ************/

  .sitemap-content { clear: both; width: 100%; padding: 80px 0; box-sizing: border-box;}
  .sitemap-content ul.sitemap { width: 100%; padding: 0; margin: 0; list-style: none; display: block;}
  .sitemap-content ul.sitemap li { padding: 0; margin: 0 20px 40px 20px; color: #fff; font-size: 1.2rem; font-weight: 500; line-height: 1.2em;}
  .sitemap-content ul.sitemap li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li a:hover { color: #ff00c8;}
  .sitemap-content ul.sitemap li ul.sitemap-up { padding: 15px 0; margin: 10px 0 0 0; border-top: 1px #999 solid; list-style: none; display: block;}
  .sitemap-content ul.sitemap li ul.sitemap-up li { padding: 0; margin: 0 0 10px 0; font-size: 1.1rem; font-weight: 300; line-height: 1.2em;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a { color: #fff; text-decoration: none; cursor: pointer;}
  .sitemap-content ul.sitemap li ul.sitemap-up li a:hover { color: #ff00c8;}


  /************ footer ************/

  footer { clear: both; width: 100%; padding: 40px 20px; box-sizing: border-box; border-top: 1px rgba(255,255,255,0.2) solid;}

  footer .support-corp-list { width: 100%; margin: 0 0 20px 0;}
  footer .support-corp-list div { margin: 0 15px 10px 0; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
  footer .support-corp-list div span.title { width: 100%; padding: 10px 10px 10px 0; color: #fff; font-size: 1rem; line-height: 1em; white-space: nowrap;}
  footer .support-corp-list div img.logo-1 { width: auto; height: 40px; margin: 0 10px 10px 0;}
  footer .support-corp-list div img.logo-2-1 { width: auto; height: 30px; margin: 0 10px 10px 0;}
  footer .support-corp-list div img.logo-2-2 { width: auto; height: 30px; margin: 0 10px 10px 0;}
  footer .support-corp-list div img.logo-3 { width: auto; height: 44px; margin: 0 10px 10px 0;}
  footer .support-corp-list div img.logo-4 { width: auto; height: 30px; margin: 10px;}
  footer .support-corp-list div img.logo-5 { width: auto; height: 18px; margin: 10px;}
  footer .support-corp-list div img.logo-7 { width: auto; height: 24px; margin: 10px;}
  footer .support-corp-list div img.logo-11 { width: auto; height: 16px; margin: 10px;}
  footer .support-corp-list div img.logo-12 { width: auto; height: 28px; margin: 10px;}
  footer .support-corp-list div img.logo-13 { width: auto; height: 22px; margin: 10px;}
  

}