@charset "utf-8";

/*============================================================
	Base Style
  ============================================================*/

* {
    box-sizing: border-box;
}

html,
body {
    height: 100%;
    width: 100%;

}

body {
    margin: 0;
    background-color: var(--basecolor);
    background-image: linear-gradient( 180.7deg,  rgba(255,150,0,0.4) 15.5%, rgba(255,255,204,0.40) 98.4% );
    
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}


.wrapper {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    min-width: 760px;
    height: 100%;
    margin: auto;
    box-shadow: rgba(0,0,0,0.7) 0px 0px 10px;
}

header {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    padding: 4px 24px;
    background-color: #ffffff;
}

.header_text {
    width: 100%;
    text-align: right;
    margin-left: 10px;
	margin-right: 0;
    padding-left: 0;
	font-size: 80%;
	line-height:35%;
}

main {
    flex-direction: row-reverse;
    flex: 1 1 auto;
    display: flex;
    height: 0;
}

main aside.side-menu {
    flex: 0 0 auto;
    background-color: #ffffff;
}

main div.content {
    flex: 1 1 auto;
    background-color: #ffffff;
}

a {
    text-decoration: none;
}


/*メインメニュー*/

.h2_style1 {
    background-color: var(--basecolor);
    background-image: radial-gradient( circle farthest-corner at 0.8% 53%,  rgba(255,150,0,1) 0%, rgba(254,221,167,1) 99.9% );
    height: 24px;
    text-align: left;
    text-indent: 20px;
    max-width: 900px;
    color: #ffffcc;
    font-size: 110%;
    padding-bottom: 2px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
    border-radius: 3px;
}

.h3_style1 {
    background-color: var(--basecolor);
    background-image: radial-gradient( circle farthest-corner at 0.8% 53%,  rgba(255,150,0,1) 0%, rgba(254,221,167,1) 99.9% );
    height: 20px;
    text-align: left;
    text-indent: 20px;
    max-width: 900px;
    color: #ffffcc;
    font-size: 90%;
    padding-bottom: 1px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
    border-radius: 3px;
}

.h4_style1 {
    background-color: var(--basecolor);
    background-image: radial-gradient( circle farthest-corner at 0.8% 53%,  rgba(255,150,0,1) 0%, rgba(254,221,167,1) 99.9% );
    height: 16px;
    text-align: left;
    text-indent: 20px;
    max-width: 900px;
    color: #ffffcc;
    font-size: 70%;
    padding-bottom: 1px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
    border-radius: 3px;
}


.title01 {
    background: url("../../2021newsite/common/images/title03.png") left no-repeat;
    max-width: 900px;
    height: 26px;
    padding-left: 35px;
    color: #715c1f;
    font-size: 70%;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;

}

.title011 {
    background: url("../../2021newsite/common/images/title04.png") left no-repeat;
    max-width: 900px;
    height: 26px;
    padding-left: 35px;
    color: #715c1f;
    font-size: 100%;
    font-weight: bold;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;

}

.title012 {
    background: url("../../2021newsite/common/images/title04.png") left no-repeat;
    max-width: 900px;
    height: 26px;
    padding-left: 35px;
    color: #715c1f;
    font-size: 100%;
    font-weight: bold;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
    border: solid 1px #715c1f;
}

.title02 {
    background: url("../../2021newsite/common/images/title05.png") left no-repeat;
    max-width: 900px;
    height: 22px;
    padding-left: 35px;
    color: #715c1f;
    font-size: 70%;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 20px;
    margin-bottom: 5px;

}

.title021 {
    background: url("../../2021newsite/common/images/title06.png") left no-repeat;
    max-width: 900px;
    height: 22px;
    padding-left: 35px;
    color: #715c1f;
    font-size: 80%;
    font-weight: bold;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;

}

.title022 {
    background: url("../../2021newsite/common/images/title06.png") left no-repeat;
    max-width: 900px;
    height: 22px;
    padding-left: 35px;
    padding-top: 1px;
    color: #715c1f;
    font-size: 80%;
    font-weight: bold;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
    border: solid 1px #715c1f;
}


.title03 {
    background: url("../../2021newsite/common/images/title07.png") left no-repeat;
    max-width: 900px;
    height: 18px;
    padding-left: 35px;
    color: #715c1f;
    font-size: 50%;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;

}

.title031 {
    background: url("../../2021newsite/common/images/title08.png") left no-repeat;
    max-width: 900px;
    height: 18px;
    padding-left: 35px;
    color: #715c1f;
    font-size: 60%;
    font-weight: bold;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;

}

.title032 {
    background: url("../../2021newsite/common/images/title08.png") left no-repeat;
    max-width: 900px;
    height: 18px;
    padding-left: 35px;
    padding-top: 4px;
    color: #715c1f;
    font-size: 60%;
    font-weight: bold;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
    border: solid 1px #715c1f;
}


content1 {
    max-width: 780px;
    margin-left: 10px;
    margin-right: 10px;
}

footer {
    flex: 0 0 auto;
    padding: 0px;
    text-align: center;
}

#menu-opend {
    display: none;
}

.menu-button{
    display: none;
}

#menu-closed {
    display: none;
}

.menu-tel{
    display: none;
}

.backdrop {
    display: none;
}

.main-menu-title {
    display: none;
}

nav p:hover {
    background-color: antiquewhite;
}

/*サイドメニュー*/

.side-menu-content{
    margin: 1px 6px;
}


/*カレンダー*/

#calender{
	text-align:center;
	table-layout:fixed;
	width:200px;
	background-color:#ffffff;
    font-size: 11.8px;
    margin-left: 1px;
    margin-right: 4px;
    margin-bottom: 4px;
	padding-right:4px;
	padding-bottom:10px;
	padding-left:0px
}

.calender_t{
    font-size: 10.5px;
    margin-top: 3px;
}

#datepicker{
    width: 200px;
    margin-left: 2px;
    margin-bottom: 2px;
}

.ui-widget-header {
background: #feb916 !important;
}

.ui-datepicker {
background: #fff8dc !important;
}

.class-holiday > .ui-state-default {
background: #ffe4e1 !important;
color: #ff1493 !important;
}

.class-weekday > .ui-state-default {
background: #ffffff !important;
color: #696969 !important;
}

.calender_t0{
    font-size: 95%;
    padding: 1px 0;
    margin: 0px;
}

.calender_t1 {
    background-color: var(--basecolor);
    background-image: radial-gradient( circle farthest-corner at 0.8% 53%,  rgba(255,150,0,1) 0%, rgba(254,221,167,1) 99.9% );
    height: 20px;
    text-align: left;
    text-indent: 10px;
    color: #ffffcc;
    font-size: 110%;
    margin-left: 2px;
    margin-right: 0px;
    margin-top: 5px;
    margin-bottom: 10px;
    border-radius: 3px;
}

/* 色設定 */
.red{
    color: #ff0000;
}
		
.blue{
    color: #0000ff;
    font-weight: normal;
}

.aqua{
    color: #3399FF;
    font-weight: bold;
}

.orange{
    color: #ff9900;
}

.sky{
    color: #00a1e9;
}

.lead {
    color: #0099CC;
}

.gray {
    color: #696969;
}

.gray01 {
    color: #777777;
}

.cation {
    color: #e10000;
    font-size: 82%;
}

/* 色設定 ここまで */




.abc {
    list-style-type: upper-alpha;
}

.number {
    list-style-type: decimal;
}


/* オンマウス：hover */

.hover_green {
  display: inline-block;
  transition: all 0.3s ease 0s;
  cursor: pointer;
}
.hover_green:hover {
  color: #4CAF50;
}

.hover_red {
  transition: all 0.3s ease 0s;
  cursor: pointer;
}
.hover_red:hover {
  color: #ff0000;
}

.hover_down01:hover {
  transform: translateY(1px)translateX(1px);
}

.hover_down02:hover {
  transform: translateY(2px)translateX(2px);
}

.hover_down03:hover {
  transform: translateY(3px)translateX(3px);
}

/* オンマウス：hover ここまで*/


/* for Mobile */
@media screen and (max-width:799px) {
    
    .wrapper{
        min-height: 1200px;
    }
    
    .content {
        min-width: 560px;
    }
    

    .menu-button{
        display: block;
        cursor: pointer;
        margin-right: 24px;
    }

    #menu-opend:checked ~ .backdrop {
        display: block;
        position: absolute;
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.6);
    }

    .main-menu-title {
        display: block;
        padding: 8px;
        text-align: center;
        background-color: #ff9600a1;
    }

    nav {
        position: absolute;
        z-index: 2;
        top: 0;
        left: 0;
        width: 0;
        height: 100%;
        overflow-x: hidden;
        overflow-y: hidden;
        background-color: white;
        transition-property: width;
        transition-duration: 0.3s;
    }
    
    nav p {
    font-size: 90%;
    margin: 0;
    padding: 6px;
    border: 1px solid #ff9600a1;
    cursor: pointer;
}

    nav ul {
        width: 260px;
        list-style: none;
    margin: 0;
    padding: 0;
    background-color: #ffffff;
    }

    nav li {
        display: block !important;
    }

    nav ul p {
        padding-left: 24px;
        border-width: 1px 0 0 0;
    }

    nav ul ul p {
        padding-left: 48px;
        border-style: dashed;
    }

    #menu-opend:checked ~ nav {
        width: 260px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    
    main aside.side-menu {
        overflow-y: auto;
        text-align: center;
        margin: 0 auto;
    }

    main {
        flex-direction: column;
        overflow-y: auto;
    }
    
    
    /*サイドメニュー*/    
    
.side-menu-a {
    max-width: 220px;
    margin: 10px 18px;
}

.side-menu-b {
    max-width: 220px;
    max-height: 240px;
    margin: 10px 18px;
}
    
.side-menu-c {
    max-width: 220px;
    overflow: auto;
    max-height: 260px;
    margin: 10px 18px;
}
    
    /*サイドメニュー横並べ*/
       
.box{
  float: left;
}

.boxContainer{
  overflow: auto;
    height: 280px;
}

}


/* for top */

@media screen and (min-width:300px) {
    
    .menu-tel{
    display: block;
    cursor: pointer;
    margin-left:  24px;
    }
}



/* for PC */
@media screen and (min-width:800px) {
    

    .wrapper {
        max-width: 1040px;
    }
    
    #global-menu li {
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #bbbbbb;
    background-color:var(--basecolor);
    background-image: linear-gradient( 178.9deg,  rgba(253,213,23,1) 18.3%, rgba(254,165,19,1) 78.9% );;
	font-size: 90%;
}
    
    #global-menu li.nobar {
        border-left: 0;
    }
    
    #global-menu ul p{
    background-color: #f8f4e6;
	font-size: 90%;
}
    
    #global-menu ul a:hover {
    color: #ff8c00;
}
       
    nav li {
        position: relative;
    }
    
    nav ul {
        list-style: none;
        margin-bottom: 1px;
        margin-left: 0px;
         margin-right: 0px;
        margin-top: 1px;
        padding: 0;
}

    nav p {
        color: #715c1f;
        margin: 0;
        padding: 6px;
        border: 0px;
        cursor: pointer;
        text-align: center;
    }
    
    nav a:hover {
    color: #ff8c00;
}

    nav>ul {
        position: relative;
        display: flex;
        width: 100%;
        justify-content: stretch;
    }

    nav>ul li {
        width: auto;
        flex-grow: 1;
    }
    nav ul ul {
        position: absolute;
        display: none;
        width: 177px;
        z-index: 1000;
    }

    nav li:not(.left) ul ul {
        left: 300px;
    }

    nav li.left ul {
        right: 0;
    }

    nav li.left ul ul {
        right: 300px;
    }

    nav li:hover>ul {
        display: block;
    }

    
    /* スクロール非表示設定 */
    
    main aside.side-menu {
        width: 230px;
        overflow-y: scroll;
        -ms-overflow-style: none;    /* IE, Edge 対応 */
        scrollbar-width: none;       /* Firefox 対応 */
        text-align: center;
    }
    
    main aside.side-menu::-webkit-scrollbar {  /* Chrome, Safari 対応 */
        display:none;
    }
    
    main div.content {
        max-width: 820px;
        overflow-y: scroll;
        /*-ms-overflow-style: none;     IE, Edge 対応 */
        /*scrollbar-width: none;        Firefox 対応 */
    }   
    
    /*main div.content::-webkit-scrollbar {  /* Chrome, Safari 対応 */
    /*    display:none;
    /*}*/
　　
     /* スクロール非表示設定 ここまで */
    
    
    
    side-menu-content {
        margin: 0px 0px 0px 5px;
    }
    
    .no-color-change {
        color: #715c1f;
    }
    
    
    
    
    /*サイドメニュー*/
.side-menu-a {
    width: 200px;
    max-height: 280px;
    margin-top: 15px;
    margin-left: 5px;
    margin-bottom: 15px;
}

.side-menu-b {
    width: 200px;
    max-height: 280px;
    margin-top: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
}
    
.side-menu-c {
    width: 200px;
    overflow: auto;
    max-height: 280px;
    margin-top: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
}
    
    
}


/*フッター*/
#foot {
	background-color: #f0e68c;
	background-image: url(/common/images/foot_bg.gif);
	background-repeat: repeat-x;
	max-width: 1040px;
	margin: 0;
    
}

#footmenu {
	margin: 0 auto;
	padding: 2px 0px 2px 0px;
}

#footmenu a:hover {
    color: #ff8c00;
}

#footmenu a {
    text-decoration: none;
    color: #715c1f	;
}


#footmenu li {
	display:inline;
	list-style-type:none;
	margin-right:5px;
	padding-left:10px;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #2e8b57;
	font-size: 70%;
}

#footmenu li.nobar {
	border-left:0;
}

.copyright {
	background-color: #feb916;
	max-width:  1040px;
    height: 20px;
    text-align: center;
    color: #ffffff;
    font-size: 75%;
    padding-top: 3px;
	overflow:hidden;
}