@charset "utf-8";
/*-------------------------------
Reset
-------------------------------*/
html { box-sizing: border-box; }
* { box-sizing: inherit; }
*:before, *:after { box-sizing: inherit; }
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, var, b, i,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, sub { margin:0; padding:0; border:0; outline:0; vertical-align:baseline; }
article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section { display:block; }
ol, ul{ list-style: none; }
blockquote, q {	quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
a {	margin:0;	padding:0; font-size:100%; vertical-align:baseline; }
del {	text-decoration: line-through; }
/*IEではデフォルトで点線を下線表示する設定ではないので、下線がつくようにしています
また、マウスオーバー時にヘルプカーソルの表示が出るようにしています*/
abbr[title], dfn[title] {	border-bottom:1px dotted;	cursor:help; }
table {	border-collapse:collapse;	border-spacing:0;	font-size: 100%; }
hr { display:block;	height:1px;	border:0;	border-top:1px solid #cccccc;	margin:1em 0;	padding:0; }
/*縦方向の揃え位置を中央揃えに指定しています*/
input, select { vertical-align: 0; }
input, textarea { margin: 0; font-size: 100%;	width: 100%; }
img { max-width: 100%; height:auto;	vertical-align:bottom; font-size:0;	line-height: 0;	border: 0; }
object, embed, video { max-width: 100%; }
address, caption, cite, code, dfn, em, th, var{	font-style: normal;	font-weight: normal; }
h1, h2, h3, h4, h5, h6{ font-size: 100%;}

/*-------------------------------
Font
-------------------------------*/
html { font-size: 18px; font-family: "Helvetica Neue", Arial, 'Kosugi Maru', sans-serif; font-weight: 400; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;text-size-adjust: 100%; -webkit-font-smoothing: antialiased; word-break: normal; word-wrap: break-word; overflow-wrap : break-word; }
body {font-size: 1rem;color: #111;line-height: 1.6; text-align: left;}
_:lang(x)::-ms-backdrop, body {font-family: "メイリオ", Meiryo, sans-serif;} /*IE11用文字スタイルハック*/
i{font-weight: 900;}
.serif{font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
.supermercado {font-family: 'Supermercado One', cursive;}

/*-------------------------------
Font Option
-------------------------------*/
.f-normal { font-weight: normal; font-weight: 400; }
.f-bold { font-weight: bold; font-weight: 700;}
.f-italic { font-style: italic;}
.f-s   { font-size: 0.875rem;}/*14px*/
.f-2s  { font-size: 0.75rem;}/*12px*/
.f-3s { font-size: 0.625rem;}/*10px*/
.f-l   { font-size: 1.125rem}/*18px*/
.f-2l  { font-size: 1.25rem;}/*20px*/
.f-3l { font-size: 1.5rem;}/*24px*/
sup { font-size: 0.5rem;	vertical-align: top; }
sub {	font-size: 0.5rem;vertical-align: baseline; }
.f-red { color: #ff0033;}
.note { padding-left: 1rem; text-indent: -1rem; }

/*-------------------------------
Link
-------------------------------*/
a { color:#111; text-decoration: none;transition: all 0.1s; }
a:hover { text-decoration: underline;color: #ff0033;transition: all 0.3s;}
.link-btn {transition: all 0.1s;}
.link-btn:hover { opacity: 0.8;transition: all 0.3s; }
button { display: block; border: none; background-color: transparent; cursor: pointer; }
@media screen and (min-width: 480px) {
	a[href^="tel:"]{pointer-events: none;}
}

/*-------------------------------
Clearfix
-------------------------------*/
.cf:after { content: " "; display: block; clear: both; }
.flc { overflow: hidden; zoom: 1; }

/*-------------------------------
Float
-------------------------------*/
.float-left { display: inline; float: left; }
.float-right { display: inline; float: right; }

/* ---------------------------------------------
Margin
--------------------------------------------- */
.mt00 { margin-top:  0   !important;}
.mt05 { margin-top:  5px !important;}
.mt10 { margin-top: 10px !important;}
.mt12 { margin-top: 12px !important;}
.mt15 { margin-top: 15px !important;}
.mt20 { margin-top: 20px !important;}
.mt25 { margin-top: 25px !important;}
.mt30 { margin-top: 30px !important;}
.mt35 { margin-top: 35px !important;}
.mt40 { margin-top: 40px !important;}
.mt45 { margin-top: 45px !important;}
.mt50 { margin-top: 50px !important;}

.mr00 { margin-right:  0   !important;}
.mr05 { margin-right:  5px !important;}
.mr10 { margin-right: 10px !important;}
.mr12 { margin-right: 12px !important;}
.mr15 { margin-right: 15px !important;}
.mr20 { margin-right: 20px !important;}
.mr25 { margin-right: 25px !important;}
.mr30 { margin-right: 30px !important;}
.mr35 { margin-right: 35px !important;}
.mr40 { margin-right: 40px !important;}
.mr45 { margin-right: 45px !important;}
.mr50 { margin-right: 50px !important;}

.mb00 { margin-bottom:  0   !important;}
.mb05 { margin-bottom:  5px !important;}
.mb10 { margin-bottom: 10px !important;}
.mb12 { margin-bottom: 12px !important;}
.mb15 { margin-bottom: 15px !important;}
.mb20 { margin-bottom: 20px !important;}
.mb25 { margin-bottom: 25px !important;}
.mb30 { margin-bottom: 30px !important;}
.mb35 { margin-bottom: 35px !important;}
.mb40 { margin-bottom: 40px !important;}
.mb45 { margin-bottom: 45px !important;}
.mb50 { margin-bottom: 50px !important;}

.ml00 { margin-left:  0   !important;}
.ml05 { margin-left:  5px !important;}
.ml10 { margin-left: 10px !important;}
.ml12 { margin-left: 12px !important;}
.ml15 { margin-left: 15px !important;}
.ml20 { margin-left: 20px !important;}
.ml25 { margin-left: 25px !important;}
.ml30 { margin-left: 30px !important;}
.ml30 { margin-left: 35px !important;}
.ml40 { margin-left: 40px !important;}
.ml45 { margin-left: 45px !important;}
.ml50 { margin-left: 50px !important;}

/* ---------------------------------------------
Align
--------------------------------------------- */
.align-left   { text-align: left;}
.align-center { text-align: center;}
.align-right  { text-align: right;}
.valign-top    { vertical-align: top    !important;}
.valign-middle { vertical-align: middle !important;}
.valign-bottom { vertical-align: bottom !important;}

/* ---------------------------------------------
Others
--------------------------------------------- */
.display-block { display: block!important;}
.inline-block { display: inline; display: inline-block!important;}
.inline { display: inline!important;}
.listDisc li{ list-style-position: outside;	list-style-type: disc; margin-left: 25px; }
.listCircle li{ list-style-position: outside; list-style-type: circle; margin-left: 25px; }
.listSquare li{	list-style-position: outside; list-style-type: square; margin-left: 25px; }
.listDecimal li{ list-style-position: outside; list-style-type: decimal; margin-left: 30px; }

/*-------------------------------
Header
-------------------------------*/
.hero{width: 100%;max-width: 1920px;margin: 0 auto;position: relative;}
.hero .text{width: 50%;max-width: 920px; text-align: center; position: absolute;bottom: 3%;left: 50%;transform: translateX(-50%);}
@media only screen and (max-width:768px) {
    .hero img{width: 100%;}
    .hero .text{width: 82%;bottom: 0;}
}

/*-------------------------------
Footer
-------------------------------*/
.footer {width: 100%;background: #cc0000;color: #fff;padding: 80px 0 80px;text-align: center;}
.footer-inner{width: 100%;max-width: 1100px;margin: 0 auto;padding: 0 20px;}
.footer-link{display: block;width: 100%;max-width: 350px; height: 76px;margin: 0 auto; display: flex;justify-content: center;align-items: center;border: 1px solid #fff;font-size: 30px;color: #fff;}
.footer-link:hover{text-decoration: none;background-color: #fff;color: #cc0000;}
.footer-text{font-size: 14px;margin-top: 25px;}
.footer-text br{display: none;}
.copyright { display: block;font-size: 14px;margin-top: 25px;}
@media only screen and (max-width: 768px) {
    .footer {padding: 50px 0 50px;}
    .footer-link{height: 70px;font-size: 28px;}
    .footer-text br{display: inline;}
    .copyright { margin-top: 30px;}
}

/*-------------------------------
Main
-------------------------------*/
body { background: #fff; }
.container { width: 100%; }
.main-block { width: 100%; width: 1100px; margin-left: auto; margin-right: auto;padding: 60px 20px 70px; }
.main-block02 { width: 100%; width: 1100px; margin-left: auto; margin-right: auto;padding:0 20px; }
@media only screen and (max-width: 1170px) {
    .main-block {width: 100%;padding: 40px 20px 50px;}
    .main-block02 { width: 100%;padding:0 20px;}
}

.sp{display: none;}
@media only screen and (max-width:768px) {
    .pc{display: none;}
    .sp{display: inline-block;}
}

.pagetop { display: block;display: flex;justify-content: center;align-items: center;text-decoration: none; width: 91px; height: 116px;position: fixed; right: -100px; bottom: 10px; z-index: 99980;transition: .1s;}
.pagetop:hover {text-decoration: none;opacity: 0.8; transition: .3s;}
.pagetop .material-icons{ color: #fff;font-size: 1.5rem;}

.bg01{background-color: #fff;}
.bg02{background-color: #f7da63;}/*背景色を変更する場合*/
.bg03{background-color: #f8f7f6;}

.main-title{text-align: center;}
.main-title span{display: block;}
.main-title .upper{font-size: 28px;font-family: 'Supermercado One', cursive!important;letter-spacing: 5px;}
.main-title .lower{font-size: 36px;letter-spacing: 3px;position: relative;margin-top: 30px;line-height: 1.4;}
.main-title .lower:before{display: block;content:'';background-image: url(../img/bar01.png);background-position: 0 0;background-size: contain; width: 100%;max-width: 320px;height: 5px; position: absolute;top: -20px;left: 50%;transform: translateX(-50%);}
@media only screen and (max-width:768px) {
    .main-title .upper{font-size: 24px;letter-spacing: 3px;}
    .main-title .lower{font-size: 30px;letter-spacing: 2px;margin-top: 25px;}
    .main-title .lower:before{width: 240px;height: 3px;top: -17px;}
}

.goal-img01{text-align: center;margin-top: 50px;}
.goal-text p{margin-top: 40px;font-size: 20px;text-align: center;}
@media only screen and (max-width:768px) {
    .goal-img01{margin-top: 30px;}
    .goal-text p{margin-top: 30px;font-size: 18px;}
    .goal-text p br{display: none;}
}

.theme-title{padding-top: 60px;}
.theme-main{width: 100%;margin: 50px auto 0;background-image: url(../img/theme_QBB_pc_bg.png);background-position: center top;background-size: contain;background-repeat: no-repeat; padding-bottom: 70px;}
.theme-img01{width: 60%;max-width: 620px;text-align: center;margin: 0 auto;}
.theme-text01{width: 100%;max-width: 910px;margin: 40px auto 0;text-align: center;}
.theme-text01 .title{font-size: 24px;color: #990000;margin-bottom: 5px;}
.theme-text01 .strong{font-size: 21px;}
.theme-text01 .ticket{text-align: center;}
.theme-img02{margin-top: 20px;text-align: center;}
.theme-link{margin-top: 30px;text-align: center;}
.theme-link .twitter{width: 100%;max-width: 380px;height: 76px;margin: 0 auto; display: flex;justify-content: center;align-items: center;background-color: #3399cc;color: #fff;font-size: 24px; line-height: 1;transition: .3s;}
.theme-link .twitter img{margin-right: 10px;}
.theme-link .twitter:hover{text-decoration: none;background-color: #4dbff8;transition: .3s;}
.theme-link .mail{width: 100%;max-width: 380px;height: 76px;margin: 30px auto 30px; display: flex;justify-content: center;align-items: center;background-color: #ff6699;color: #fff;font-size: 24px; line-height: 1;transition: .3s;}
.theme-link .mail:hover{text-decoration: none;background-color: #ff82a8;transition: .3s;}
.theme-link p{font-size: 28px;margin-top: 20px;}
@media only screen and (max-width:768px) {
    .theme-title{padding-top: 40px;}
    .theme-main{background: none;margin: 30px auto 0;padding-bottom: 50px;}
    .theme-img01{width: 100%;max-width: 100%;text-align: center;margin: 0 auto;}
    .theme-img01 img{width: 100%;}
    .theme-text01{margin: 30px auto 0;text-align: center;}
    .theme-text01 .title{font-size: 22px;color: #990000;margin-bottom: 5px;}
    .theme-text01 .strong{font-size: 20px;}
    .theme-text01 .ticket{text-align: center;}
    .theme-img02{margin-top: 20px;text-align: center;}
    .theme-link .mail:hover{text-decoration: none;background-color: #ff82a8;transition: .3s;}
    .theme-link p{font-size: 18px;margin-top: 10px;}
    .theme-link p.f-red{font-size: 24px;}
}

.partner-text01{width: 100%;max-width: 910px;margin: 40px auto 0;text-align: center;}
.partner-img01{width: 100%;max-width: 541px;margin: 40px auto 0;}
.partner-img02{width: 100%;max-width: 709px;margin: 0px auto 80px auto;}
.partner-img03{width: 100%;max-width: 709px;margin: 10px auto 0px auto;}

.partner-text02{width: 100%;max-width: 910px;margin: 40px auto 0;text-align: left;}

@media only screen and (max-width:768px) {
    .partner-text01{margin: 30px auto 0;}
    .partner-img01{margin: 30px auto 0;}
    .partner-img02{margin: 0px auto 30px auto;}
    .partner-img03{margin: 10px auto 0px auto;}

    .partner-text02{margin: 30px auto 0;text-align: left;}
}

.event-text01 .title{font-size: 30px;color: #990000;margin-bottom: -30px;}
.event-text01{width: 100%;max-width: 910px;margin: 40px auto 0;text-align: center;}
.event-text02{width: 100%;max-width: 910px;margin: 40px auto 50px;text-align: center;font-size: 26px;}
.event-text02 .strong{font-size: 60px;}
.event-text02 .ex{display: flex;justify-content: center;align-items: center;}
.event-text02 .normal{font-size: 20px;}
.event-img01{width: 100%;max-width: 820px;margin: 40px auto 0;}
@media only screen and (max-width:768px) {
    .event-text01 .title{font-size: 20px;color: #990000;margin-bottom: -10px;}
    .event-text01{margin: 30px auto 0;}
    .event-text02{margin: 30px auto 40px;font-size: 20px;}
    .event-text02 .strong{font-size: 40px;line-height: 1.4;}
    .event-text02 .ex{flex-direction: column;}
    .event-text02 .normal{font-size: 14px;}
    .event-img01{margin: 30px auto 0;}
}

.education-img01{width: 100%;max-width: 467px;margin: 40px auto 0;}
.education-text01{width: 100%;max-width: 910px;margin: 40px auto 0;text-align: center;font-size: 30px;}
.education-text02{width: 100%;max-width: 910px;margin: 40px auto 0;text-align: center;}
.education-text03{width: 100%;margin: 40px auto 0;text-align: center;}
.education-text03 .text{margin: 30px 0;}
.education-list{margin-top: 40px;display: flex;justify-content: space-between;flex-wrap: wrap;}
.education-list li{width: 31.37%;margin-top: 30px;}
@media only screen and (max-width:768px) {
    .education-img01{margin: 30px auto 0;}
    .education-text01{margin: 30px auto 0;font-size: 26px;}
    .education-text02{margin: 30px auto 0;}
    .education-text03{margin: 30px auto 0;}
    .education-text03 .text{margin: 20px 0;}
    .education-list{margin-top: 20px;}
    .education-list li{width: 48%;margin-top: 20px;}
}

.csr-img{display: flex;justify-content: space-between;margin: 40px 0 80px;}
.csr-img img{width: 48%;max-width: 491px;}
@media only screen and (max-width:768px) {
    .csr-img{display: flex;justify-content: space-between;margin: 40px 0 80px;}
    .csr-img{flex-direction: column; margin: 20px 0 60px;}
    .csr-img img{width: 100%;max-width: 491px;margin: 20px auto 0;}
}

.collaboration-block{padding-top: 50px;padding-bottom: 90px;}
.collaboration-img{display: flex;justify-content: space-between;margin: 30px auto 0;}
.collaboration-img img{width: 100%;max-width: 491px;margin: 0 auto 0;}/*コラボ3回め追加の際は width: 48%;に変更し、margin: 0 auto 0;を削除すること-*/
@media only screen and (max-width:768px) {
    .collaboration-block{padding-top: 20px;padding-bottom: 60px;}
    .collaboration-img{flex-direction: column;}
    .collaboration-img img{width: 100%;max-width: 491px;margin: 0 auto 0;}
    .collaboration-img img:first-child{margin-bottom: 40px;}
}