@charset "utf-8";
            body{
                width: 97vw;
                max-width: 2200px;
                margin-left: auto;
                margin-right: auto;
                margin-top:0;
                margin-bottom:0;
                font-family:system-ui,-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Meiryo, sans-serif;
                max-width:2100px;
                background-image:url(indeximg/item1.jpg);
            }
            em{
                font-style:normal;
            }
            header{
                 margin-top:0;
            }
            header section{
                padding-top:5px;
                overflow: hidden;
            }
            header section div{
                display: flex;
            }
            hgroup{
                margin-left:1em;
                margin-right:1em;
            }
            header section h1{
                font-family:'Yu Mincho',serif;
                font-size:2em;
                margin-top:4px;
                margin-bottom:0;
                background-color:white;
                width:11em;
                text-align:center;
                border-radius:0.3em;
                color:#800000;
            }
            address{
                font-style:normal;
            }
	    address ul{
		list-style-type:none;
	    }
	
            /*メニュー*/
            .meinmenu{
                display:none;
            }
            .header_menu{
                list-style-type:none;
                margin-top:6px;
                margin-bottom: 6px;
                padding-left: 5px;
            }
            .header_menu li{
                display: inline-block;
            }
            .header_menu li a{
                text-decoration:none;
                color:#ffffff;
                background-color:#1A60BF;
                transition: all 0s 0.5s ease;
                margin-left:0.2rem;
                padding-left:0.2em;
                padding-right:0.2em;
                border:solid 2px darkred;
                border-radius: 1em;
                font-size:1.4em;
            }
            .header_menu li a:hover{
                color:#1A60BF;
                background-color:#D0E2FB;
            }
             .grid{
                display: grid;
                grid-template-columns:repeat(12,1fr);
                grid-template-rows:repeat(4,auto);
                gap: 5px;
            }
            .slick-prev:before,
            .slick-next:before {
                color: #330066;
            }
            .item1{
                grid-column:1/13;
                background-color: bisque;
            }
            .wrop{
                margin-top: 3px;
                margin-left: auto;
                margin-right:auto;
            }
            .item1 img{
                width: 100%;
                object-fit: cover;
            }
            .item2{
                grid-column:1/13;
                grid-row:2/3;
            }
            .info{
                display: grid;
                grid-template-columns:1fr 1fr;
                grid-template-rows:repeat(2,auto);
                gap: 5px;
            }
            .info dl dd{
                margin-left: 20px;
            }
            .info1{/*体育部*/
               /* grid-column:1;
                grid-row:span 2;*/
                border: 2px solid  #330066;
                background-color:#ffeaea;
                padding-left: 5px;
                border-radius: 10px; 
                order:1;
            }
            .info2{/*文化部*/
               /* grid-column:2;
                grid-row: 1/span 1;*/
                border: 2px solid #003366;
                background-color:#d6ffd6;
                padding-left: 5px;
                border-radius: 10px;
                order: 2;
            }
            .info3{/*青少年部*/
                /*grid-column:1;
                grid-row: 3/span 1;*/
                border:2px solid;
                background-color:#d6ffd6;
                padding-left: 5px;
                border-radius: 10px;
                order:3;
            }
            .info4{/*その他*/
               /* grid-column:2;
                grid-row:span 2;*/
                border: 2px solid #003366;
                background-color: #ffeaea;
                padding-left: 5px;
                border-radius: 10px;
                order:4;
            }
            .info1 h3,.info2 h3,.info3 h3,.info4 h3{
                margin-top: 10px;
                margin-bottom: 5px;
            }
            .info1 dl,.info2 dl,.info3 dl,.info4 dl{
                margin-top: 0px;
                margin-bottom: 5px;
            }
            .item4{
                grid-column:1/6;
                grid-row: 3/5;
                background-color:bisque; 
            }
            .item4 p{
                text-align: center;
            }
            .koinfo1 li::marker{
                color:fuchsia;
            } 
            .koinfo2 li::marker{
                color:brown;
            }            
            .item5 dt{
                margin: 2px 1px 6px;
                outline: #8b0000 solid 2px;
                border-radius: 4px;
                white-space: nowrap;
                overflow: hidden;
                width:clamp(319px, 70%, 900PX);
                margin-left: auto;
                margin-right: auto;
                cursor: pointer;
            }
            #report dd{
                display: flow-root;  
            }
            #report dd div{
                width: 40%;
                margin-left: auto;
                margin-right: auto;
                float: left;
            }
            #report dd img{
                width: 100%;
            }
            #report dd p{
                margin-top: 4px;
                margin-bottom: 2px;
                padding-left: 4px;
                color:maroon;
            }
            .item5{
                grid-column: 6/13;
                grid-row: 3/4;
                background-color:#ffffc1;
            }
            .item5 dt::before{content: "+";}
            #report .selected::before{content: "×";}
            #report .selected{
                background-color:#F0FFFF;
            }
            .item6{
                grid-column:6/13;
                grid-row: 4/5;
                background-color: bisque;
            }
            .item6 h3,.item6 p{
                margin-top: 8px;
                margin-bottom: 8px;
            }
            .item6 ul{
                margin-top: 0;
                margin-bottom:0;
            }
            .sub{
                background-color:#ccff99;
                margin-top:5px;
                margin-left:5px;
                padding-bottom: 3px;
                box-shadow: 3px 5px 1px 2px rgba(0,0,0,0.4);
            }
            .sub button{
                font-size:1.3em;
                background-color:white;
                margin-top:10px;
                margin-left:20px;
                border:ridge 7px gold;
                border-radius:7px;
            }
            .sub button a{
                color:maroon;
                text-decoration:none;
            }
            .rink {
                outline:solid 1px plum;
                margin:5px;
                list-style-image: url("indeximg/img_o017.gif");
            }
            .rink li:first-child{
                list-style-image:none;
                list-style-type: none;
            }
            .rink li h3{
                margin-top:7px;
                margin-bottom:4px;
            }
            .bosyu ul{
                color:#8b0000;
            }
            .bosyu ul li::marker{
                color:red;
            }
            .googlecal{
                height: 440px;
                margin-bottom:10px;
            }
            footer{
                background-color:#FFFFCC;
                border-top:solid 1px black;
                border-bottom:solid 1px black;
                margin-top:5px;
            }
            footer p{
                width:18em;
                margin:0 auto 0;
                text-align:center;
            }
            .modalwin-contents img{
                width:clamp(315px,99%,600px);
                margin-left: auto;
                margin-right: auto;
                }
                .modalwin-contents{
                width: 90%;
                margin-left: auto;
                margin-right: auto;
                margin-top: 0px;
                padding-top: 5px;
                overflow-x: auto;
                }
                #shade{
                    width: 100%;
                    margin-left: auto;
                    margin-right: auto;
                }
                .modalwin{
                    position: fixed;
                    max-width:80%;
                    background: #99FF33;
                
                    }
                .modalwin hide{
                width: 50%;
                }
                .modalwin-contents ul{
                margin-top: 4px;
                padding-left: 20px;
                }
                .show{
                display:block;
                }
                .hide{
                display:none;
                }
                .modalwin-contents clear{
                width:clamp(320px,100%,500px); 
                margin-left: auto;
                margin-left: auto;
                margin-right: auto;
                }
                .modalwin{
                width: 50%;
                }
                @media screen and (min-width:791px){
                    .wrop{
                        width: 85%;
                    }
                #report dd div{
                    margin-right: 1px;
                    margin-left: -17PX;
                }
                aside{
                    display: flex;
                    flex-direction:row-reverse;
                    width: 98%;
                    margin-left: auto;
                    margin-right: auto;
                    }
                .three-1{
                    flex-basis:63.5%;
                    }
                .three-2{
                    flex-basis:36%;
                    }
                .googlecal{
                    margin-left:10px;
                    margin-right:5px;
                    margin-top:5px;
                }
                }
                @media screen and (max-width:790px){
                header section h1{
                    font-size:1.5em;
                }
                .header_menu li a{
                    font-size:0.9em;
                }
                #report dd div {
                    float: none;
                    width: clamp(305px, 80%, 340px);
                    margin-left: auto;
                    margin-right: auto;
                }
                .item5 dd {
                    margin-left: 4px;
                    margin-right: 4px;
                }
                .wrop{
                    width: 95%;
                }
                .modalwin{
                width:99%;
                }
                .modalwin-contents img{
                width:90%;
                }
            }
            @media screen and (max-width:750px){
                .grid,.info {
                    display: block;
                }
                .info3{
                    background-color: #ffeaea;
                }
                .info4{
                    background-color:#d6ffd6 ;
                }
                .info1,.info2,.info3{
                    margin-top:10px;
                    margin-bottom:10px;
                }
                .item5 dt{
                    line-height:1.5em;
                }
            }
            @media screen and (max-width:596px){
                header section div{
                    display: block;
                }
                address{
                    margin-left: 15px;		
                }
		address ul{
			padding-left:0;
		}
                .wrop{
                    width: 90%;
                }
                .item5 dt{
                    width: 100%;
                }
            }
            @media screen and (max-width:576px) {
                .header_menu li a{
                    font-size:1.4em;
                }
                .meinmenu{
                    display:block;
                    font-size:1.2em;
                }
                .header_menu{
                    display:none;
                    text-align:center;
                    padding-top: 3px;
                    padding-left:0px;
                }
                .header_menu li{
                    margin-top:2px;
                    margin-bottom:5px;
                }
                .wrop{
                    width: 95%;
                }
                .item4{
                    outline:2px solid #003366;
                    border-radius: 10px;
                }
                .modalwin{
                width:95%;
                }
                .modalwin-contents img{
                width:100%;
                }
            }