@charset "UTF-8";
body{margin:0}
.pc-only{display:block}
.sp-only{display:none}
.font-w{font-weight:700}
.act_guideline{color:#333;font-family:"游ゴシック Medium","Yu Gothic Medium",YuGothic,"ヒラギノ角ゴシック Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;padding-right:40px}
.box-group{padding:60px 0 40px}
.box-group+.box-group{margin-top:25px}
.bg-purple{background:#f5f7ff}
.bg-purple .challenge-title span{color:#6752a6}
.bg-purple .box .title-wrap{background:-webkit-gradient(linear,left bottom,left top,from(#8674bc),to(#917fc6));background:-o-linear-gradient(bottom,#8674bc,#917fc6);background:linear-gradient(to top,#8674bc,#917fc6)}
.bg-pink{background:#fff5f5}
.bg-pink .challenge-title span{color:#a65252}
.bg-pink .box .title-wrap{background:-webkit-gradient(linear,left bottom,left top,from(#b56a6a),to(#c17070));background:-o-linear-gradient(bottom,#b56a6a,#c17070);background:linear-gradient(to top,#b56a6a,#c17070)}
.page-title{margin:50px auto 60px}
.page-title img{margin:auto}
.challenge-title{margin:0 0 45px;text-align:center;font-weight:700;font-size:1.63em;line-height:1.8;position:relative}
.challenge-title::before{content:'';width:58px;height:1px;background:#333;position:absolute;bottom:-15px;left:calc(50% - 39px)}
.box{display:-webkit-box;display:-ms-flexbox;display:flex;margin:20px auto 0;width:91.3%}
.box .title-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-negative:0;flex-shrink:0;width:220px;padding:5px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;text-align:center;font-weight:700}
.box .title-wrap .box-title{margin:0;font-size:1.25em;line-height:1.5em;position:relative;letter-spacing:2px;white-space:nowrap}
.box .title-wrap .box-title::before{content:'';background:#fff;position:absolute}
.box .title-wrap .box-title span{font-size:1.5em}
.box .title-wrap .box-subtitle{margin-top:21px;line-height:1.38em}
.box .content-wrap{background:#fff;padding:33px 30px 33px 18px;line-height:1.75em}
.box .content-wrap ul{margin:0}
.mdl-close-btn{margin-top:60px;padding:22px 5px;background:#f2f2f2;width:100%;cursor:pointer;text-align:center;font-weight:700;color:#787878;font-size:1.31em;position:relative}
.mdl-close-btn::before{content:'';background:url(/brand/img/mdl_close_buttom.png) no-repeat center;background-size:contain;width:20px;height:20px;position:absolute;top:calc(50% - 11px);left:calc(50% + 1.8em)}
@media print,screen and (min-width:813px){.box .title-wrap .box-title::before{width:33px;height:1px;bottom:-10px;left:calc(50% - 16px)}
.mdl-close-btn:hover{opacity:.7}
}
@media screen and (max-width:777px){.pc-only{display:none}
.sp-only{display:block}
.act_guideline{padding-right:10px}
.box-group{padding:37px 0 25px}
.box-group+.box-group{margin-top:20px}
.page-title{margin:20px auto 23px}
.challenge-title{margin:0 0 40px;font-size:1.13em;line-height:1.33em}
.challenge-title::before{width:39px;left:calc(50% - 18px);bottom:-10px}
.box{display:block;width:89.29%}
.box .title-wrap{padding:14px 5px;width:100%;display:block}
.box .title-wrap div{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.box .title-wrap .box-title{padding:0 11px 0 25px;font-size:.88em}
.box .title-wrap .box-title::before{width:1px;height:22px;left:100%;top:calc(50% - 11px)}
.box .title-wrap .box-title span{font-size:1.43em}
.box .title-wrap .box-subtitle{margin-top:0;font-size:.88em;line-height:1.21em;text-align:left;padding-left:11px}
.box .content-wrap{padding:20px 17px 20px 0}
.box .content-wrap ul{padding-left:35px}
.box .content-wrap ul li{font-size:.88em;line-height:1.64em}
.box .content-wrap ul li+li{margin-top:8px}
.mdl-close-btn{margin-top:25px;font-size:.88em;padding:12px 3px}
.mdl-close-btn::before{width:14px;height:14px;top:calc(50% - 8px)}
}


