@charset "utf-8";
/* CSS Document */

#pageBody {border-top:5px solid #00428e;}
#wrapper {overflow:hidden; position: relative; }

section .inner {width: 976px; margin:auto; }
section .inner .camp_logo {display: block; margin: 55px auto; }

div.container#schedule {background:url(/assets/img/pc/bg_content3.jpg) no-repeat 0 0; position:relative; }
div.container#schedule h3 {font-size:33px; color:#fff; text-align: center; margin:55px 0 30px; }
div.container#schedule .inner .game_info {padding: 30px 0 54px; margin: 20px auto 0; width: 976px; background-color:#005bab; color:#fff; }

div.container#schedule p.date {color: #fff; text-align: center; margin-bottom: 10px; font-size: 21px;}

div.container#content {padding:40px 0 128px; }
div.container#content h3 {font-size:34px; color:#003479; text-align: center; margin-bottom:20px; }
div.container#content .inner p.intro {font-size:38px; margin:60px 0 50px; }
div.container#content .inner h2 + p {font-size:16px; line-height:28px; margin-top:30px;}
div.container#content .inner p.lead {font-size:16px; line-height:28px; color: #ffffff; text-align:center; text-shadow:0px 0px 16px #001e45; margin-top:30px; font-weight:bold; }
div.container#content .inner p.lead strong {font-size:21px; display:block; margin-bottom:12px; }
div.container#content .inner .contents1 .inner {width:750px; padding-bottom:120px; overflow:hidden; }

div.container#content .inner .contents1 .inner .present3 {display:flex; justify-content:space-between; }
div.container#content .inner .contents1 .inner .present3 div .item {width:220px; }
div.container#content .inner .contents1 .inner .present3 div .item.saba {width:340px; }

div.container#content .inner .game_info {margin:20px auto 0;}
div.container#content .inner .contents1 .item {/*width:150px;*/ display:block; margin:0 auto; }
div.container#content .inner .contents1 .inner p.att {font-size:14px; line-height:24px; }
div.container#content .inner .contents1 sup {font-size:75%;}
div.container#content img.logo {display: block; margin:0 auto 40px; }

div.container#content .inner .game_info {padding:30px 0 54px;}
div.container#content .inner .game_info .game_info_ttl {font-size:32px; font-weight:bold; text-align:right; width: 520px; margin:0 auto 30px; }
div.container#content .inner .game_info .game_info_ttl span {font-size:18px; display:block; padding-bottom:10px; }

div.container#content .inner .game_info .camp_report {padding:30px 40px 0; }
div.container#content .inner .game_info div.container#content .inner .contents1 .inner.camp_report img {float: left; margin-right: 30px; width: 240px; }
div.container#content .inner .game_info .camp_report dl dd {font-size: 18px; }
div.container#content .inner .game_info .camp_report .btn_report {color: #00428e; background: #fff; padding: 17px; text-decoration: none; display: inline-block; margin-top: 22px; font-weight: bold; }
div.container#content .inner .game_info .camp_report .btn_report::after {content: ""; width: 17px; height: 16px; display:inline-block; background-image: url("/assets/img/pc/arrow2.png"); margin-left: 10px; }

div.container#content .inner .uniform {text-align: center; margin-top: 100px; }
div.container#content .inner .uniform h3 {margin-bottom: 50px; }
div.container#content .inner .uniform p {width: 580px; text-align: left; margin: 20px auto 0; line-height: 1.8; }


/* 歴史 */
div.container#history {width:100%; margin:0 auto; padding:50px 0 200px; }
div.container#history h3 {background-color:#0082b3; width:100%; height:64px; font-family:'Teko'; font-weight:normal; font-size:48px; line-height:72px; color:#fff; text-align:center; position:relative; margin-bottom:0; }
div.container#history .history_hdr {width:100%;}
div.container#history .history_caption {text-align:right; font-size:12px; padding:5px; line-height:1.4;}

div.container#history h4 {font-size:36px; text-align:center; margin:70px 0 65px; }
div.container#history .inner p {font-size:16px; line-height:32px; margin-bottom:1em; }

div.container#history .history-table {margin:55px 0 0; }

div.container#history .history-table .year {font-size:40px; color:#a8a8a8; letter-spacing:-2px; font-family:'Bahnschrift', sans-serif; text-align:right; width:130px; padding-right:30px; display:table-cell; vertical-align:top; }
div.container#history .history-table .year span {font-size:12px; font-family:メイリオ, Meiryo, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN; display:block; letter-spacing:0px; line-height:1.4; }
div.container#history .history-table .detail {padding:10px 0 75px 30px; display:table-cell; vertical-align:top; background: url(/assets/img/pc/history_table_line.png) repeat-y left top; line-height:24px; }

div.container#history .history-table .detail .figure_box {display:flex; /*max-width:768px;*/}
div.container#history .history-table .detail figure {margin:20px 0 20px 0; display:table; }
div.container#history .history-table .detail figure.left {margin-right:50px;}
div.container#history .history-table .detail figure figcaption {color:#666; font-size:12px; font-family:Meirio; line-height:18px; display:table-caption; caption-side:bottom; }

a.gototop {text-decoration:none; background:url(/assets/img/pc/arrow.png) no-repeat; padding-left:36px; height:36px; line-height:36px; color:#005bab; display:inline-block; margin:0; }


div.container#content .overlay p {padding-top:200px;}

div.container#hero .hero_img {position:relative; }
div.container#hero .hero_img img {top:0; left:0; position:absolute;}

footer {font-size: 12px; }


/* レポート */

    div.container#schedule .inner .game_info dl dt,
	div.container#content .inner .game_info dl dt {
        float: left;
        width: 80px;
        font-size: 14px;
        font-weight: bold;
        color: #fff000;
        line-height: 48px;
        text-align: right
    }
	div.container#schedule .inner .game_info dl dd,
    div.container#content .inner .game_info dl dd {
        font-size: 24px;
        font-weight: bold;
        color: #ffffff;
        line-height: 40px;
        padding-left: 112px;
		margin-bottom: 10px;
    }
    div.container#schedule .inner .game_info dl dd span,
	div.container#content .inner .game_info dl dd span {
        display: block;
        font-size: 14px;
        font-weight: normal;
        color: #bac9d1;
        line-height: 20px
    }
	
div.container#news dl dd a {color:#bac9d1;}
div.container#news dl dd a:hover {color:#bac9d1;}

.btn_report2 {background:#fff; margin:20px 0 50px;  }
.btn_report2 a {display:block; font-size:21px; color:#005bab; text-decoration:none; text-align:center; padding:15px; }
.btn_report2 a::after {content: ""; width: 17px; height: 16px; display:inline-block; background-image: url("/assets/img/pc/arrow2.png"); margin-left: 10px; }

.btn_report2 a:hover {color:#fff; background:#005bab; }
.btn_report2 a:hover::after {background-image: url("/assets/img/pc/arrow3.png");}


/* Umiosシリーズ動画 */
.tubeBox {overflow:hidden; padding:50px 0; }
.tubeBox .vtrBox {
    width: 976px;
    margin: 0 auto;
    position: relative;
    padding-top: 56.25%;
    height: auto;
}
.vtrBox .embed {
    position: absolute;
    top: 2.5%;
    right: 0;
    width: 100%;
    height: 95%;
    max-height: 530px;
}

.tubeBox2 {overflow:hidden; padding:50px 0 0 0;}
.tubeBox2 .vtrBox2 {
    width: 976px;
    margin: 0 auto;
    position: relative;
    padding-top: 39%;
    height: auto;
}
.vtrBox2 .embed {
    position: absolute;
    top: 2.5%;
    right: 0;
    width: 100%;
    height: 95%;
    max-height: 530px;
}


/* 声 */
.voice {width:100%; }
.voice.voice1 {background:url(/assets/img/pc/voice2_bg.jpg) no-repeat center bottom; background-size:cover; padding:20px 0 90px;}
/*.voice.voice2 {background:url(/assets/img/pc/voice2_bg.jpg) no-repeat center bottom; background-size:cover; margin-bottom:20px; padding:35px 0 50px;}*/

.voice .balloon_box {width:100%; max-width:1089px; margin:0 auto; overflow:hidden; }
.voice .balloon_box .balloon {display:flex; flex-direction:row;}
.voice .balloon_box .balloon li {position:relative; background:#fff; padding:20px; margin-right:2.5%; margin-bottom:50px; border-radius:7px; width:22%; text-align:left; font-size:12px; line-height:1.6; }
.voice .balloon_box .balloon li:after{content: ""; position:absolute; width: 0px; height: 0px; margin: auto; border-style: solid; border-color: #fff transparent transparent transparent;}
.voice .balloon_box .balloon li:first-child:after {left:20%; bottom:-20px; border-width:30px 30px 0 0px;}
.voice .balloon_box .balloon li:nth-child(2):after {left:20%; bottom:-20px; border-width:30px 30px 0 0px;}
.voice .balloon_box .balloon li:nth-child(3):after {right:20%; bottom:-20px; border-width:30px 0 0 30px;}
.voice .balloon_box .balloon li:last-child:after {right:20%; bottom:-20px; border-width:30px 0 0 30px;}
.voice .btn_more {background:#fff; padding:15px 0; border-radius:30px; color:#1397ff; text-decoration:none; font-size:16px; font-family:メイリオ, Meiryo; display:block; margin:10px auto 0; width:300px; text-align:center; }
.voice .btn_more:hover {background:#1397ff; color:#fff; }
.voice p.voicelead {color:#fff; font-size:16px; margin-bottom:25px; line-height:1.8; text-align:center; }
.voice div.comment_theme{ margin:20px auto; text-align:center; }


/* アーカイブ */
div.container#archives {width:100%; margin:0 auto; padding:50px 0 80px; }
div.container#archives h3 {background-color:#00aaea; width:100%; height:64px; font-family:'Teko'; font-weight:normal; font-size:48px; line-height:72px; color:#fff; text-align:center; position:relative; margin-bottom:0; }

div.container#archives .inner .title {
font-size: 24px;
font-weight: bold;
line-height: 32px;
color: #00aaea;
margin-top: 24px;
text-align: center;
}

div.container#archives .archives_box {
width: 100%;
display: flex;
justify-content: space-between;
margin: 35px 0 0 0;
}
div.container#archives .archives_box a.archive {
display: block;
width: 470px;
border: 1px solid #d0d0d0;
padding: 18px 18px 13px 18px;
box-shadow: 0px 6px 0px 0px rgba(157, 157, 157, 0.32);
text-decoration: none;
}
div.container#archives .archives_box a.archive span {
display: block;
margin-top:11px;
line-height: 1.4;
}
div.container#archives .archives_box a.archive:hover {
color:#0F91C7;
}

section .inner.gototop_wrap {width:976px; padding:40px 0;}





@media screen and (min-width: 768px), print {
div.container#news dl {width:800px;}
}

@media screen and (max-width: 767px), print {

.br-pc{display:none;}
#siteHeader {position: static; }
#pageBody {padding-top: 0; }

section .inner {width: auto;}

div.container#content {padding:20px; }
div.container#content .inner .contents1 .inner p {font-size:14px;}

div.container#content .inner p.lead {padding: 0 16px 35vw; text-align:left; }
div.container#content .inner .intro {padding-top: 10vw;}
div.container#content .inner p.intro {font-size:25px;}
div.container#content .inner p.lead {padding: 0 16px 3vw;}
div.container#content .inner .contents1 .inner {width:auto; padding:0 5px; margin:10px 0 60px; }

div.container#content .inner .game_info dl dt {float: none; width: 100%; text-align: left; line-height: 20px; }
div.container#content .inner .game_info dl dd {padding-left: 0; font-size: 17px; line-height:30px; margin-bottom:10px; }

div.container#news dl dt {padding:0; float: left; }
div.container#news dl dd {padding-left:120px; line-height:18px; margin-bottom:10px;}
div.container#news dl dt.new::before {left:80px;}

table.new_product {width:100%; max-width:500px; font-size:14px;}
div.container#content .inner p.lead {font-size:14px; line-height:24px; }

/* 歴史 */
div.container#history h4 {font-size:28px; margin:40px 0; }
div.container#history .history-table .year {font-size:26px; width:70px; padding-right:10px; }
div.container#history .history-table .detail {padding:0 0 30px 15px; font-size:14px; line-height:18px; }
div.container#history .history-table .detail .figure_box {display:block;}
div.container#history .inner p {font-size:14px; line-height:26px; }
div.container#history .history_caption {text-align:left;}

div.container#history .history-table .detail .figure_box {display:block; max-width:70%;}
div.container#history .history-table .detail figure.left {margin-right:0;}
div.container#history .history-table .detail figure img {width:100%;}

div.container#content h3 {font-size: 26px; line-height: 1.5; }

div.container#content .inner .game_info {padding: 30px 0; /*margin-bottom:18px;*/ }
div.container#content .inner .game_info .game_info_ttl {font-size:28px; padding:0 5vw; width:100%; text-align:left; line-height: 1.5;}

div.container#content .inner .game_info .camp_report img {width: 100%; float: none; margin: 0 0 20px; }
div.container#content .inner .game_info dl {padding: 0 5vw; }
div.container#content .inner .game_info .camp_report {padding: 5vw; }
div.container#content .inner .game_info .camp_report p { line-height: 1.4;}

div.container#content .inner .game_info dl.game_info_detail2 {padding: 0; }
div.container#content .inner .uniform p {width: auto; font-size: 14px; }
div.container#content .inner .uniform {padding: 15px; margin-top: 50px; }
div.container#content .inner .uniform img {width: 70%; }

div.container#content img.logo {width: 70%; }


#schedule .inner{ margin-bottom: 0 !important; padding: 15px; }
div.container#schedule .inner .game_info{padding: 20px; margin-bottom: 0 !important}
div.container#schedule h3{ font-size:18px; margin: 0 0 20px 0; line-height:1.4;}
div.container#schedule .inner .game_info dl dd, div.container#content .inner .game_info dl dd{font-size: 14px; padding: 0; }
div.container#schedule .inner .game_info{width: 100%;}
div.container#schedule .inner .game_info dl dt, div.container#content .inner .game_info dl dt{float: none; text-align: left; line-height: 1.5; width: 100%; margin-bottom: 0}
.game_info_detail + p{margin-top: 0  !important; line-height: 1.5 !important; text-align: left !important;}

div.container#schedule p.date {font-size:15px; line-height:1.4;}

/* とつげき！Umios 140 */
.media_140 .wrap{padding: 20px;}
.lead{display: block;}
.lead div{margin-left: 0; text-align: center;}
.lead p{margin-left: 0; margin-top: 20px; font-size: 14px;}
.media_140 .wrap ul li a{}
.media_140 .wrap ul li{width: 48%;}
.media_140 .wrap ul li a figure figcaption{font-size: 14px !important;padding: 20px 10px;}
.media_140 .wrap ul li a figure figcaption br{display: none;}
.media_140 .wrap ul li:first-child, .media_140 .wrap ul li:nth-child(2){ width: 100%; }
.media_140 .wrap .more a{margin-top: 20px;}
.media_140 .wrap ul li:first-child a figure figcaption,
.media_140 .wrap ul li:nth-child(2) a figure figcaption{height: auto !important; }


/* 声 */
.voice .balloon_box .balloon {display:block; }
.voice .balloon_box .balloon li {width:90%; margin:30px auto;}
.voice p.voicelead {font-size:14px; line-height:1.4; }


/* Umiosシリーズ動画 */
.tubeBox .vtrBox {
    width: 100%;
}
.vtrBox .embed {
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    box-shadow: none;
}

.tubeBox2 .vtrBox2 {
    width: 100%;
	padding-top: 74%;
}
.vtrBox2 .embed {
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    box-shadow: none;
}

/* アーカイブ */
div.container#archives {width:100%; margin:0 auto; padding:50px 0 0; }

div.container#archives .archives_box {
width: 100%;
display: block;
margin: 20px 0 0 0;
}
div.container#archives .archives_box a.archive {
display: block;
width:90%;
border: 1px solid #d0d0d0;
padding: 18px 18px 13px 18px;
box-shadow: 0px 6px 0px 0px rgba(157, 157, 157, 0.32);
text-decoration: none;
margin:20px 20px 30px;
}

div.container#archives .archives_box a.archive span {
font-size: 14px;
}

div.container#content .inner.gototop_wrap {width:100%; padding:25px 0;}

div.container#content .inner .contents1 .inner .present3 {
	display: block;
}


}

/* for ipad */
@media screen and (min-width: 768px) and (max-width:1024px) {
div.container#hero div {width:100%; margin:0;}
section .inner {width:100%; margin:auto; padding:0 5vw; }
section .inner .mirai .inner {padding:0; }
div.container#content .inner .contents1 .inner {width:100%;}
div.container#archives .archives_box a.archive {width:49%;}
div.container#archives .archives_box a.archive img {width:100%;}

}