@charset "utf-8";
/* CSS Document */

body,form,fieldset{margin: 0px;padding: 0px;}
fieldset          {border:none;}
h1,h2,h3,h4,h5,h6,p,pre,blockquote,ul,ol,dl,dd{margin: 0px;padding: 0px;}
blockquote,li,dt,dd{}
li                {list-style:none;}
input,textarea    {font-size: 1em;}
img{border: 0px none;margin: 0;padding: 0;vertical-align: bottom;}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

html              {scroll-behavior: smooth; height:100%;}

/* Tag Castam ----------------------------------------------------------------------------------------------------------------- */


body              { font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
 color: #231212; font-feature-settings: "palt"; overflow:hidden auto; position:relative;}
em                {font-weight: normal;font-style: normal;}
strong            {}
a                 {text-decoration: none; color: #000;}
a:link            {}
a:visited         {}
a:active          {}
a:focus           {}


.ma5              {margin-bottom:5px;}
.ma10             {margin-bottom:10px;}
.ma20             {margin-bottom:20px;}
.ma30             {margin-bottom:30px;}
.ma40             {margin-bottom:40px;}
.ma50             {margin-bottom:50px;}
.ma60             {margin-bottom:60px;}
.ma80             {margin-bottom:80px;}

.pa40             {padding: 0 40px;}

.flex             { display:flex;}
.right            { float: right;}
.center           { text-align:center;}
.end              { text-align:end;}
.justify          { text-align:justify;}

p                 { font-size:16px; line-height:1.6rem;}

h2                { font-size:60px;}
h3                { font-size:32px; letter-spacing:0.3rem;}

.sp               { display:none;}


.w100             { width:100%;}

.pink             { color:#ef2e4e;}


@media(max-width: 932px){
a[href^="tel:"]   { pointer-events: none;}
}

.vertical_line                     { position: absolute; top:0; bottom:0; width:50px; background:#3d24d7; z-index:1;}

.tab_cont,.sp_cont                 { display:none;}


/* header */
header                             { max-width:1200px; margin:0 auto; padding:20px 0; justify-content:space-between; position:relative; align-items:center; letter-spacing:0.1rem; z-index:1;}
header span                        { font-size:18px; font-weight:bold;}
header h2                          { line-height:4.0rem; color:#ef2e4e;}
header .pink                       { font-size:18px; font-weight:bold;}

header .right_box a                { display:block;}
header .left_box                   { display:flex; align-items:center; margin-right:100px; gap: 20px;}

/* 250401改修箇所 */
header .left_box .g-menu           { align-items:center; gap:20px}
header .left_box .g-menu a         { font-weight:bold; font-size:14px; position:relative; text-decoration: none;}
header .left_box .icon-box         { gap: 8px;}
header .left_box .icon-box li      { display: flex; align-items: center;}
header .left_box .icon-box li a    { display: inline-flex; width: 20px; height: auto;}
header .left_box li img            { width: 100%;}
/* 250401改修箇所 */

header .left_box .line,header      { color:#ef2e4e;}
header .left_box .line a::after    {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 100%;
    height: 2px;
    background:#ef2e4e;
    transition: all .15s;
    transform: scale(0, 1);
    transform-origin: center top;}
header .left_box .line::after      { transform: scale(1, 1);}

header .left_box a.current         { font-weight: bold; color:#ef2e4e; border-bottom:3px solid #ef2e4e; pointer-events: none;}


/* footer */
footer                             { background:#f4e8ed;}
footer .foot_box                   { max-width:1200px; margin:0 auto; padding:15px 0; align-items:center;}

/* 250401改修箇所 */
footer .foot_box a                 { display: inline-flex; width: 20px; height: auto;}
footer .foot_box .icon-box         { gap: 8px;}
footer .foot_box .icon-box li      { display: flex; align-items: center;}
footer .foot_box .icon-box li img  { width: 100%;}
/* 250401改修箇所 */


/* copy */
#copy                              { width: 100%; position: relative;}
#copy small                        { font-size: 12px; color: #000; letter-spacing: 0.05em; align-items: baseline;}


/* main slider                                                                                       */
.slider                            { position:relative; width:100%; z-index:-1;}
.slider .slider_item01             { background:url(../img/main01.jpg);}
.slider .slider_item02             { background:url(../img/main02.jpg);}
.slider .slider_item03             { background:url(../img/main03.jpg);}
.slider .slider_item04             { background:url(../img/main04.jpg);}
.slider .slider_item05             { background:url(../img/main05.jpg);}
.slider .slider_item               { width:100%; height:900px; background-repeat:no-repeat; background-position:right; background-size:contain;}


.fadein                            { opacity : 0; transform : translate(0, 100px); transition : all 1.5s;}
.fadein.active                     { opacity : 1; transform : translate(0, 0);}


/* content */
#contbox                           { max-width:1200px; margin:0 auto; padding:0 0 40px;}


.head_border                       { display:flex; align-items:center; margin-bottom:40px;}
.head_border:before                { content:""; height:1px; background-color:#c3b7b9; margin-right: 1rem; width:200px;}
.head_border:after                 { content:""; height:1px; background-color:#c3b7b9; margin-left: 1rem; flex-grow:1;}
.head_border h2                    { margin-right: 1rem;}
.head_border li                    { font-size:20px; font-weight:bold;}

.heading                           { align-items: center; display: flex; justify-content: center;}
.heading::before,.heading::after   { background-color: #231212; content: ""; height: 1px; width: 20px;}
.heading::before                   { margin-right: 15px;}
.heading::after                    { margin-left: 15px;}

.detail01 a                        {
     display:block;
     margin:auto;
     max-width:250px;
     border:1px solid #ef2e4e;
     padding:10px 20px; color:#ef2e4e;
     font-weight:bold;
     background: linear-gradient(-60deg, #ef2e4e 0%, #ef2e4e 30%, #fff 30%, #fff 100%);
     position:relative;
     font-size:18px;
     overflow: hidden;
     z-index: 1;}
.detail01 a::before                 {
     content: "";
     position: absolute;
     left: 86%; top: 42%; width: 10px; height: 10px;
     border-top: 3px solid #fff; border-right: 3px solid #fff;
     -webkit-transform: rotate(45deg);
     transform: rotate(45deg);
     display: inline-block;}
.detail01 a::after                 {
     background: linear-gradient(-60deg, #fff 0%, #fff 30%, #ef2e4e 30%, #ef2e4e 100%);
     position: absolute;
     top: 0; left: 0; width: 100%; height: 100%;
     content: "";
     transform: scale(0, 1);
     transform-origin: left top;
     transition: .15s cubic-bezier(0.45, 0, 0.55, 1);
     z-index: -1;}

.detail02 a                        {
     display:block;
     max-width:250px;
     border:1px solid #fff;
     padding:10px 20px;
     color:#fff;
     font-weight:bold;
     background: linear-gradient(-60deg, #fff 0%, #fff 30%, #ef2e4e 30%, #ef2e4e 100%);
     position:relative;
     font-size:18px;
     overflow: hidden;
     z-index: 1;}
.detail02 a::before                {
     content: "";
     position: absolute;
     left: 86%; top: 42%; width: 10px; height: 10px;
     border-top: 3px solid #ef2e4e; border-right: 3px solid #ef2e4e;
     -webkit-transform: rotate(45deg);
     transform: rotate(45deg);
     display: inline-block;}
.detail02 a::after                 {
     background: linear-gradient(-60deg, #ef2e4e 0%, #ef2e4e 30%, #fff 30%, #fff 100%);
     position: absolute;
     top: 0; left: 0; width: 100%; height: 100%;
     content: "";
     transform: scale(0, 1);
     transform-origin: left top;
     transition: .15s cubic-bezier(0.45, 0, 0.55, 1);
     z-index: -1;}

.detail03 a                        {
     display:block;
     margin:auto;
     max-width:250px;
     border:1px solid #ef2e4e;
     padding:10px 20px;
     color:#fff;
     font-weight:bold;
     background: linear-gradient(-60deg, #fff 0%, #fff 30%, #ef2e4e 30%, #ef2e4e 100%);
     position:relative;
     font-size:18px;
     overflow: hidden;
     z-index: 1;}
.detail03 a::before                {
     content: "";
     position: absolute;
     left: 86%; top: 42%; width: 10px; height: 10px;
     border-top: 3px solid #ef2e4e; border-left: 3px solid #ef2e4e;
     -webkit-transform: rotate(-45deg);
     transform: rotate(-45deg);
     display: inline-block;}
.detail03 a::after                 {
     background: linear-gradient(-60deg, #ef2e4e 0%, #ef2e4e 30%, #fff 30%, #fff 100%);
     position: absolute;
     top: 0; left: 0; width: 100%; height: 100%;
     content: "";
     transform: scale(0, 1);
     transform-origin: left top;
     transition: .15s cubic-bezier(0.45, 0, 0.55, 1);
     z-index: -1;}

/* sns */
#sns .snsbox                       { background: #fef0f3; padding:40px 10px;}
#sns .snsbox .flex                 { justify-content: space-between; align-items: center;}
#sns .snsbox .flex img             { width: 100%; padding: 0 10px;}



/* policy */
#policy                            { position:relative;}
#policy:before                     { content:""; border-top: solid 550px rgba(239,46,78,0.07); border-right: solid 320px transparent; display:inline-block; vertical-align:middle; position:absolute; left:0%; top:22%; z-index:-1;}
#policy .heading                   { font-size:20px; font-weight:bold;}
#policy .challenge                 { font-size:38px; font-weight:bold;}
#policy .challenge span            { font-size:80px; font-weight:bold; vertical-align: middle; line-height:5.5rem;}
#policy .flex                      { align-items:center;}
#policy dl                         { justify-content:space-between; max-width:780px; margin:0 auto 40px;}
#policy dt .challenge              { font-weight:bold; margin-left:10px; letter-spacing: 0.25rem;}
#policy .promise01 dt.challenge    { color:#45b035; font-size:48px;}
#policy .promise02 dt.challenge    { color:#ed6c00; font-size:48px;}
#policy .promise03 dt.challenge    { color:#00a0e9; font-size:48px;}


/* report */
#report .perspective               { max-width:680px; margin:0 auto 40px; font-size:38px; font-weight:bold; line-height:3.0rem; position:relative;}
#report .perspective:after         { content:""; background:url(../img/report01.png) no-repeat; background-size:contain; vertical-align:middle; display:inline-block; width:288px; height:281px; position:absolute; left:92%; top:-150%; z-index:1;}
#report .report_box                { background:#f7e3ea; padding:60px 0; position:relative; justify-content:center;}
#report .report_box dl             { min-width:30%;}
#report .report_box dd             { font-size:18px; font-weight:bold;}
#report .report_box:before         { content:""; background:url(../img/report25.png) no-repeat; background-size:contain; vertical-align:middle; display:inline-block; width:97px; height:101px; position:absolute; left:2%; top:-10%; z-index:1;}
#report .report_box a               { display:block;}
#report .report_box a img           { top:0; position:relative;}


/* profile */
#profile .profile_box              { background: linear-gradient(-65deg, #fff 0%, #fff 30%, #ef2e4e 30%, #ef2e4e 100%); padding:40px 0px 40px 40px; position:relative;}
#profile .profile_box:after        { content:""; background:url(../img/profile01.jpg) no-repeat; background-size:contain; vertical-align:middle; display:inline-block; width:507px; height:670px; position:absolute; left:55%; top:10%; z-index:1;}
#profile .profile_box .justify     { color:#fff; max-width:50%;}
#profile .profile_box .heading     { align-items: center; display: flex; justify-content: flex-start; color:#fff; font-size:20px; font-weight:bold;}
#profile .profile_box .heading::before,#profile .profile_box .heading::after
                                   { background-color: #fff; content: ""; height: 1px; width: 20px;}
#profile .profile_box .heading::before 
                                   { margin-right: 15px;}
#profile .profile_box .heading::after
                                   { margin-left: 15px;}
#profile .profile_box .name        { font-size:38px; color:#fff; font-weight:bold;}
#profile .profile_box .name span   { font-weight:100; font-size:16px; margin-left:10px; vertical-align:middle;}
#profile .detail01                 { display:none;}

/* contact */
#contact p                         { font-size:20px; font-weight:bold;}
#contact .contact_box ul           { justify-content:center; align-items:center;}
#contact .contact_box li           { margin:0 40px; font-weight:bold;}
#contact .contact_box li span      { font-weight:100;}
#contact .contact_box h4           { font-size:38px; border-bottom:1px solid #c3b7b9; padding-bottom:5px; margin-bottom:10px;}
#contact .contact_box dl           { justify-content:space-between;}
#contact .contact_box dt           { margin-right:10px;}
#contact .map                      { width:50%;}
#contact h4                        { font-size:38px;}
#contact .join                     { display:block; margin:0 auto 40px; max-width:300px; padding:10px 20px; color:#ef2e4e; font-weight:bold; font-size:20px; background: #f4e8ed; position:relative; border-radius:50px;}
#contact .download_text            { font-size:18px; font-weight:bold; max-width:700px; margin:0 auto 40px;}
#contact .download_text .flex      { align-items:flex-start;}
#contact .download_text dt span    { background:#ef2e4e; border-radius:50px; color:#fff; width:20px; height:20px; line-height:20px; text-align:center; font-size:16px; margin-right:5px; display:inline-block;}
#contact .download_btn .flex       { justify-content:space-between; align-items:center;}
#contact .download_btn a           { display:block; max-width:600px; color:#fff; font-weight:bold; background: linear-gradient(120deg, #fff 0%, #fff 20%, #ef2e4e 20%, #ef2e4e 100%); border:1px solid #ef2e4e; margin:auto; padding:10px 30px; font-size:20px;}


/* report_cont */
#report_cont .perspective          { max-width:680px; margin:0 auto 40px; font-size:38px; font-weight:bold; line-height:3.0rem; position:relative;}
#report_cont .perspective:after    { content:""; background:url(../img/report01.png) no-repeat; background-size:contain; vertical-align:middle; display:inline-block; width:288px; height:281px; position:absolute; left:92%; top:-5%; z-index:1;}
#report_cont .report_box           { background:#f7e3ea; padding:80px 0 40px; position:relative; justify-content:space-between; flex-wrap:wrap;}
#report_cont .report_box dl        { min-width:25%; margin-bottom:40px;}
#report_cont .report_box dd        { font-size:18px; font-weight:bold;}
#report_cont .report_box:before    { content:""; background:url(../img/report_new.png) no-repeat; background-size:contain; vertical-align:middle; display:inline-block; width:97px; height:101px; position:absolute; left:2%; top:-2%; z-index:1;}
#report_cont .report_box a img     { top:0; position:relative;}
#report_cont .view_txt             { font-size:20px; font-weight:500; line-height:2.5rem;}


/* policy_cont */
#policy_cont                       { position:relative;}
#policy_cont .challenge            { font-size:38px; font-weight:bold;}
#policy_cont .challenge span       { font-size:100px; font-weight:bold; vertical-align: middle; margin:0 0.5rem; line-height:5.5rem;}
#policy_cont .heading              { font-size:20px; font-weight:bold;}
#policy_cont .challenge_box        { max-width:980px; margin:auto;}
#policy_cont dl                    { justify-content:space-between; margin:0 auto 80px;}
#policy_cont dt                    { min-width:60%;}
#policy_cont dt li                 { padding-left: 0.8rem; text-indent: -0.8rem;}
#policy_cont dd img                { width: 100%;}
#policy_cont .promise01            { font-weight:bold; letter-spacing: 0.25rem; color:#45b035; font-size:48px; line-height: normal;}
#policy_cont .promise02            { font-weight:bold; letter-spacing: 0.25rem; color:#ed6c00; font-size:48px; line-height: normal;}
#policy_cont .promise03            { font-weight:bold; letter-spacing: 0.25rem; color:#00a0e9; font-size:48px; line-height: normal;}


/* profile_cont */
#profile_cont .heading             { align-items: center; display: flex; justify-content: flex-start; color:#fff; font-size:20px; font-weight:bold;}
#profile_cont .heading:before,#profile .heading:after
                                   { background-color: #fff; content: ""; height: 1px; width: 20px;}
#profile_cont .heading::before     { margin-right: 15px;}
#profile_cont .heading::after      { margin-left: 15px;}
#profile_cont #contbox             { max-width:980px; margin:0 auto; padding:0 0 40px;}
#profile_cont .profile_box         { padding:40px; color:#fff; font-weight:bold; background:#ef2e4e; justify-content:space-between; max-width:980px; margin:0 auto 40px;}
#profile_cont .profile_box dd      { margin-left:2rem;}
#profile_cont .player_days         { justify-content:space-between; max-width:980px; margin:0 auto 40px;}
#profile_cont .player_days .pc     { display:block;}
#profile_cont .player_days .sp     { display:none;}
#profile_cont .war_record          { justify-content:space-between;}
#profile_cont .war_record span     { background:#3d24d7; color:#fff; padding:10px; font-size:28px; font-weight:bold; margin-bottom:20px; display: inline-block;}
#profile_cont .war_record dd span  { border-radius:50px; color:#f4f22f; font-size:14px; display: inline; padding:5px 20px;}
#profile_cont .war_record dt       { min-width:190px;}
#profile_cont .winning .flex       { justify-content:space-between; align-items:center; font-size:28px; font-weight:bold;}
#profile_cont .winning .flex li:nth-child(1)
                                   { width:43%;}
#profile_cont .winning ul:nth-child(2)
                                   { flex-direction: row-reverse;}
#profile_cont .post                { justify-content:space-between;}
#profile_cont .post span.pink      { font-size:28px; font-weight:bold;}
#profile_cont .awards              { justify-content:space-between;}
#profile_cont .awards span         { color:#3d24d7; font-size:28px; font-weight:bold;}
#profile_cont .awards dt           { min-width:100px;}


@media (hover: hover) {
header .left_box a:hover img       { opacity:0.5; transition:.15s;}
header .left_box .line a:hover     { color:#ef2e4e;}
header .left_box .line a:hover::after
                                   { transform: scale(1, 1);}

footer .foot_box a:hover img       { opacity:0.5; transition:.15s;}

.detail01 a:hover                  { color: #fff;}
.detail01 a:hover:before           { border-top: 3px solid #ef2e4e; border-right: 3px solid #ef2e4e;}
.detail01 a:hover:after            { transform: scale(1, 1);}

.detail02 a:hover                  { color: #ef2e4e;}
.detail02 a:hover:before           { border-top: 3px solid #fff; border-right: 3px solid #fff;}
.detail02 a:hover:after            { transform: scale(1, 1);}

.detail03 a:hover                  { color: #ef2e4e;}
.detail03 a:hover:before           { border-top: 3px solid #fff; border-left: 3px solid #fff;}
.detail03 a:hover:after            { transform: scale(1, 1);}

#sns .flex a:hover img             { top:10px; opacity:0.5; transition:0.3s;}

#report .report_box a:hover img    { top:10px; opacity:0.5; transition:0.3s;}
#report_cont .report_box a:hover img
                                   { top:10px; opacity:0.5; transition:0.3s;}

#contact .download_btn a:hover     { opacity:0.5; transition:.15s;}
}


@media (hover: none) {
header .left_box a:active img      { opacity:0.5; transition:.15s;}
header .left_box .line a:active    { color:#ef2e4e;}
header .left_box .line a:active::after
                                   { transform: scale(1, 1);}

footer .foot_box a:active img      { opacity:0.5; transition:.15s;}

.detail01 a:active                 { color: #fff;}
.detail01 a:active:before          { border-top: 3px solid #ef2e4e; border-right: 3px solid #ef2e4e;}
.detail01 a:active:after           { transform: scale(1, 1);}

.detail02 a:active                 { color: #ef2e4e;}
.detail02 a:active:before          { border-top: 3px solid #fff; border-right: 3px solid #fff;}
.detail02 a:active:after           { transform: scale(1, 1);}

.detail03 a:active                 { color: #ef2e4e;}
.detail03 a:active:before          { border-top: 3px solid #fff; border-left: 3px solid #fff;}
.detail03 a:active:after           { transform: scale(1, 1);}

#sns .flex a:active img            { top:10px; opacity:0.5; transition:0.3s;}

#report .report_box a:active img   { top:10px; opacity:0.5; transition:0.3s;}
#report_cont .report_box a:active img
                                   { top:10px; opacity:0.5; transition:0.3s;}

#contact .download_btn a:active    { opacity:0.5; transition:.15s;}

}

@media only screen and (max-width: 1380px) {
.slider .slider_item                 { height:640px;}
}

@media only screen and (max-width: 1280px) {
header                             { padding:20px 20px 20px 70px;}
header .left_box                   { margin-right:0;}

footer .foot_box                   { padding:15px 10px 15px 70px;}

/*.slider .slider_item               { height:640px;}*/

.head_border:before                { width: 120px;}

#contbox                           { padding:20px 20px 20px 70px;}

#report .perspective:after         { left:87%;}

#profile .profile_box:after        { width:497px;}

#report_cont .perspective:after    { left:87%;}

}


@media only screen and (max-width: 1024px) {
header                             { padding:20px 20px 20px 40px;}

footer .foot_box                   { padding:15px 10px 15px 40px;}

h2                                 { font-size:50px;}

.vertical_line                     { width:20px;}

.slider .slider_item               { height:550px;}

#contbox                           { padding:20px 20px 20px 40px;}

#report .perspective:after         { left:76%;}

#profile .profile_box:after        { width:437px; height:572px; top:18%;}

#report_cont .perspective:after    { left:76%;}

#policy_cont .challenge_box        { padding:20px 20px 20px 40px;}

#profile_cont #contbox             { padding:20px 20px 20px 40px;}
#profile_cont .profile_box         { max-width:100%;}
#profile_cont .player_days         { max-width:100%;}
#profile_cont .player_days .pc     { padding-left:20px;}


}



@media only screen and (max-width: 932px) {
.pc                                { display:none;}
.sp                                { display:block;}

p                                  { font-size:14px;}

.vertical_line                     { width:10px;}

header                             { align-items: flex-start; padding:20px 20px 20px 30px;}
header .left_box                   { margin-right:60px;}

/*ナビのスタイル                                                                    */
#nav                               { clear: both;}
nav                                {
     display: block;
     position: fixed;
     top: 0;
     right: -50%;
     bottom: 0;
     width: 50%;
     background: #ffffff;
     overflow-x: hidden;
     overflow-y: auto;
     transition: all .5s ease;
     -webkit-transition: all .5s ease;
     -webkit-overflow-scrolling: touch;
     z-index: 998;
     opacity: 0;}
.open nav                          {
     right: 0%;
     display:block;
     opacity:1;
     transform: translateX(0);
    -webkit-transform: translateX(0);
     overflow-y: auto;
     -webkit-overflow-scrolling: touch;}
.navmenu ul                        {
    width: 100%;
    position: absolute;
    top: 20%;
    left: 0;
    display:block;}
.navmenu li a                      {
     display:block;
     margin:0 0 20px 40px;
     padding:0 40px 20px;
     border-bottom:solid 1px #ef2e4e;
     font-size:16px;
	 font-weight: bold;}


/*ハンバーガーメニュー                                                                    */
.hamburger                         {
    position: fixed;
    right:0;
    top: 0;
    width: 70px;
    height: 70px;
    cursor: pointer;
    z-index: 999;
    display: block;
    background:#ef2e4e;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;}
.hamburger span                    {
    display: block;
    position: absolute;
    width: 40px;
    border-bottom: solid 2px #fff;
    transition: all .3s;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    left: 15px;}
.hamburger span:nth-child(1)       { top:22px;}
.hamburger span:nth-child(2)       { top:34px;}
.hamburger span:nth-child(3)       { top:46px;}
.open .hamburger span:nth-child(1) {
    top: 34px;
    left: 14px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    border-bottom: solid 2px #fff;}
.open .hamburger span:nth-child(2),
.open .hamburger span:nth-child(3){
    top: 34px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    border-bottom: solid 2px #fff;}

/* mask */
#mask                             { display: none; transition: all .3s; -webkit-transition: all .3s;}
.open #mask {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .8;
    z-index: 2;
    cursor: pointer;}
#nav #menu                         { display: block;}


footer .foot_box                   { padding:15px 10px 15px 30px;}


.main_box                          { position:relative; top:-162px; margin-bottom:-162px;}
.slider .slider_item01             { background:url(../img/main01.jpg) none; background:url(../img/main01_sp.jpg);}
.slider .slider_item02             { background:url(../img/main02.jpg) none; background:url(../img/main02_sp.jpg);}
.slider .slider_item03             { background:url(../img/main03.jpg) none; background:url(../img/main03_sp.jpg);}
.slider .slider_item04             { background:url(../img/main04.jpg) none; background:url(../img/main04_sp.jpg);}
.slider .slider_item05             { background:url(../img/main05.jpg) none; background:url(../img/main05_sp.jpg);}
.slider .slider_item               { height:615px; background-repeat:no-repeat; background-position:right; background-size:contain;}

.tab_cont                          { display:block;}

.head_border                       { margin-bottom:20px;}
.head_border:before                { flex-grow: 1; width:auto;}
.head_border h2                    { margin-right:0;}

#contbox                           { padding:20px 0;}

#sns .sp                           { margin-top:-20px; font-size:20px; padding-left: 10px;}
#sns .snsbox                       { padding: 40px 0px 40px 10px;}
#sns .snsbox .flex                 { flex-wrap: wrap; justify-content:center;}
#sns .snsbox .flex li              { width: 33%; text-align: center;}
#sns .snsbox .flex img             { padding: 10px;}


#policy .heading                   { padding-left:10px;}
#policy:before                     { left:-10%; top:25%;}
#policy .sp                        { padding:0 20px 0 30px;}
#policy dl                         { justify-content:center; /*flex-wrap:wrap;*/}
#policy dt                         { font-weight:bold; line-height:165px; margin-right: 1.5em;}
#policy dd                         { min-width: 315px;}
#policy dd .challenge              { letter-spacing:0.3rem;}
#policy .flex                      { flex-wrap: wrap; justify-content: center;}
#policy .challenge                 { font-size:38px; line-height:50px; padding-left: 10px;}
#policy .promise01 dt.challenge,#policy .promise02 dt.challenge,#policy .promise03 dt.challenge                       { padding: 0;}

#report .sp                        { margin-top:-20px; font-size:20px;}
#report .report_box:before         { left:5%;}
#report .perspective               { font-size:36px; max-width:90%;}
#report .perspective:after         { width: 238px; height: 251px; left:70%; top:-100%;}

#profile .profile_box              { background:#ef2e4e;}
#profile .profile_box:after        { width:346px; height:481px; top:18.5%;}

#contact h4,#contact p             { padding-left: 10px;}
#contact .contact_box h4           { border-bottom:none;}
#contact .contact_box ul           { flex-wrap:wrap; padding:0 20px 0 30px;}
#contact .contact_box li           { margin:0 auto;}
#contact .contact_box li span      { display:block; margin-bottom:20px;}
#contact .map                      { width:100%; margin-bottom:0;}
#contact .download_text            { max-width:90%; padding-left:10px;}

#report_cont .sp                   { margin-top:-20px; font-size:20px;}
#report_cont .report_box:before    { /*left:5%;*/ display:none;}
#report_cont .perspective          { font-size:36px; max-width:90%;}
#report_cont .perspective:after    { width: 238px; height: 251px; left:70%; top:-100%;}
#report_cont .view_txt             { max-width:90%; margin:0 auto 60px;}
#report_cont .report_box dl        { min-width:50%;}

#policy_cont .heading              { padding-left:10px;}
#policy_cont:before                { left:-10%; top:17%;}
#policy_cont .flex                 { padding:0 20px 0 30px; flex-wrap: wrap; justify-content: flex-start;}
#policy_cont .flex dt              { margin-bottom:20px; min-width: 50%;}
#policy_cont .title                { padding:0 20px 0 30px; font-size:30px;}
#policy_cont .challenge            { font-size:36px; line-height:50px; padding-left:10px;}
#policy_cont .challenge_box        { padding:0;}

#profile_cont .heading             { padding-left:10px;}
#profile_cont:before               { left:-10%; top:17%;}
#profile_cont #contbox             { padding:0 20px 0 30px;}
#profile_cont .profile_box         { padding:40px 20px;}
#profile_cont .player_days .pc     { padding-left:10px;}
#profile_cont .war_record dd span  { display:inline-block; padding:5px 10px;}
#profile_cont .war_record img      { width:100%;}
#profile_cont .winning .flex li,#profile_cont .winning .flex li:nth-child(1)
                                   { width:50%;}
#profile_cont .winning ul:nth-child(2) li:nth-child(1)
                                   { margin-left:1rem;}
#profile_cont .winning img         { width:100%;}
#profile_cont .post li             { width:50%;}
#profile_cont .post img            { width:100%;}
#profile_cont .awards li           { width:50%;}
#profile_cont .awards img          { width:100%;}
}


@media only screen and (max-width: 428px) {
h2                                 { font-size:28px;}

b                                  { font-size:16px;}

.heading::before                   { margin-right:10px;}
.heading::after                    { margin-left:10px;}

.detail01 a                        { font-size:16px;}
.detail02                          { display:none;}

header                             { padding:15px 10px 15px 25px}
header h2                          { line-height:2.0rem; font-size:28px;}
header span                        { font-size:14px;}
header .pink                       { font-size:14px;}
header .left_box                   { margin-right:30px;}

.hamburger                         { width:50px; height:50px;}
.hamburger span                    { width:25px; left:12px;}
.hamburger span:nth-child(1)       { top:15px;}
.hamburger span:nth-child(2)       { top:24px;}
.hamburger span:nth-child(3)       { top:33px;}
.open .hamburger span:nth-child(1) { top: 24px; left: 12px;}
.open .hamburger span:nth-child(2),
.open .hamburger span:nth-child(3) { top: 24px;}

nav                                { right:-60%; width:60%;}
.navmenu li a                      { font-size:14px; margin: 0 0 20px 20px; padding: 0 20px 20px;}

footer .foot_box                   { padding:15px 10px 15px 25px;}
#copy small                        { font-size:8px;}

.slider                            { height:414px;}
.slider .slider_item               { height:441px;}

.tab_cont                          { display:none;}
.sp_cont                           { display:block;}


#sns .snsbox                       { padding: 20px 0px 20px 10px;}
#sns .snsbox .flex img             { padding: 5px;}


#policy .head_border               { margin-bottom:0;}
#policy .heading                   { font-size:16px;}
#policy .challenge                 { font-size:24px; margin:0 0 10px;}
#policy .challenge span            { font-size:60px; line-height:inherit; vertical-align: bottom; margin:0 0.2rem;}
#policy dd .challenge              { letter-spacing:0.1rem; padding-left:0;}
#policy .promise01 dt.challenge, #policy .promise02 dt.challenge, #policy .promise03 dt.challenge                       { font-size: 38px;}
#policy dd                         { min-width:inherit;}
#policy:before                     { left: -40%; top: 15%;}


#report .perspective               { font-size:18px; line-height:2.0rem; margin:0 auto 25px;}
#report .perspective:after         { width: 142px; height: 142px; left: 66%; top: -78%;}
#report .report_box:before         { width:77px; height:81px; top:-7%;}
#report .report_box a img          { width:80%;}


#profile .profile_box              { padding:20px 20px 20px 30px; margin-bottom:20px;}
#profile .profile_box .name        { font-size:24px; text-align:center;}
#profile .profile_box .name span   { font-size:14px;}
#profile .profile_box .heading     { font-size:16px; justify-content:center;}
#profile .profile_box:after        { display:none;}
#profile .profile_box .justify     { max-width:100%;}
#profile .detail01                 { display:block;}


#contact .head_border              { margin-bottom:0;}
#contact p                         { font-size:16px; margin-bottom:20px;}
#contact .contact_box h4           { font-size:24px;}
#contact .contact_box li           { font-size:14px;}
#contact h4                        { font-size:24px;}
#contact .join a                   { font-size:16px;}
#contact .download_text .flex      { align-items: flex-start; margin-bottom: 10px;}
#contact .download_text dt span    { font-size:12px;}
#contact .download_text            { font-size:14px;}
#contact .download_btn             { padding:0 10px 0 20px;}
#contact .download_btn a           { font-size:14px; padding:10px 15px;}
#contact .download_btn .pdf        { width:30px; margin-right: 25px;}


#report_cont .perspective          { font-size:18px; line-height:2.0rem; margin:0 auto 25px;}
#report_cont .perspective:after    { width: 142px; height: 142px; left: 66%; top: -78%;}
#report_cont .report_box:before    { width:77px; height:81px; top:-7%;}
#report_cont .report_box a img     { width:70%;}


#policy_cont .heading              { font-size:16px;}
#policy_cont .challenge            { font-size:24px; padding-left:10px; margin:0 0 10px;}
#policy_cont .challenge span       { font-size:60px; line-height:inherit; vertical-align: bottom; margin:0 0.2rem;}
#policy_cont:before                { left: -40%; top: 11%;}
#policy_cont .title                { font-size:24px; line-height: 2.0rem;}
#policy_cont .flex dt              { font-size:14px;}
#policy_cont .flex dt .pink        { font-size:18px;}
#policy_cont .flex                 { flex-wrap:wrap; /*padding: 0 20px 0 1rem;*/}
#policy_cont .flex dd              { width:100%; text-align:center;}
#policy_cont .flex dd img          { width:100%;}
#policy_cont dl:nth-child(2n-1)    { flex-direction: row;}
#policy_cont .promise01,#policy_cont .promise02,#policy_cont .promise03
                                   { font-size:38px;}

/* profile_cont */
#profile_cont .heading             { font-size:16px;}
#profile_cont .profile_box         { flex-wrap:wrap; justify-content:center; padding: 20px 20px 20px 30px;}
#profile_cont .profile_box dt      { min-width:53px;}
#profile_cont .player_days .pc     { display:none;}
#profile_cont .player_days .sp     { display:block; padding-left:10px;}
#profile_cont .war_record          { flex-wrap:wrap; justify-content:center;}
#profile_cont .war_record li:nth-child(1)
                                   { margin-bottom:20px;}
#profile_cont .war_record span     { font-size:24px;}
#profile_cont .winning .flex       { flex-wrap:wrap; justify-content:center; font-size:24px;}
#profile_cont .winning .flex li, #profile_cont .winning .flex li:nth-child(1)
                                   { width:100%;}
#profile_cont .winning ul:nth-child(2) li:nth-child(1),#profile_cont .winning li:nth-child(1)
                                   { margin:0 0 20px;}
#profile_cont .post                { flex-wrap:wrap; justify-content:center;}
#profile_cont .post li             { width:100%;}
#profile_cont .post li:nth-child(1)
                                   { margin:0 0 20px;}
#profile_cont .post span.pink      { font-size:24px;}
#profile_cont .awards              { flex-wrap:wrap; justify-content:center;}
#profile_cont .awards li           { width:100%;}
#profile_cont .awards li:nth-child(1)
                                   { margin:0 0 20px;}
#profile_cont .awards span         { font-size:24px;}


}


@media only screen and (max-width: 393px) {
.slider                            { height:374px;}
.slider .slider_item               { height:421px;}
}


@media only screen and (max-width: 375px) {
b                                  { font-size:14px;}

.slider                            { height:414px;}
.slider .slider_item               { height:408px;}

.main_box                          { margin-bottom:-200px;}
.main_box .sp_cont                 { position:relative; top:-50px;}


#policy .challenge                 { font-size:20px;}

#report .perspective               { font-size:16px;}
#report .perspective:after         { left: 63%;}


#contact p                         { font-size:14px;}
#contact .download_btn .pdf        { width:28px;}


#report_cont .perspective          { font-size:16px;}
#report_cont .perspective:after    { left: 63%;}
#report_cont .report_box dl        { max-width:50%;}

#policy_cont .challenge            { font-size:20px;}


}

@media only screen and (max-width: 360px) {
.slider                            { height:404px;}
.slider .slider_item               { height:396px;}

#policy dt                         { font-size:140px; margin-right:0;}
#policy .challenge                 { letter-spacing:normal;}

#report .perspective:after         { width: 132px; height: 132px; left: 63%; top: -64%;}

#contact .download_btn .pdf        { margin-right:35px;}

#report_cont .perspective:after    { width: 132px; height: 132px; left: 63%; top: -64%;}

#policy_cont .challenge            { letter-spacing:normal;}

}


