/* CSS Document */
.leftMenu {max-width: 364px;}
.leftMenuMain > .tit {position: relative; z-index: 1; background: #d55446; color: #fff; font-weight: 400; line-height: 1.111111; letter-spacing: 0.1px; padding: 19px 0 20px 65px; border-radius: 7px 7px 0 0; margin: 0;}
.leftMenuMain > .tit::before {content: ''; background: url("../../images/icon_04h.png") no-repeat center / cover; width: 38px; height: 37px; position: absolute; top: 10px; left: 12px;}
.leftMenuMain > .tit a:link, .leftMenuMain > .tit a:visited {text-decoration:none; color:#fff; background-color: transparent; padding: 0; display: block; position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.leftMenuMain > .tit a:active, .leftMenuMain > .tit a:hover {text-decoration:none; color:#fff!important; font-weight: 400; padding: 0; cursor:pointer; transition: all 0.5s ease 0s;}

.leftMenuMain > .tit_blue {background: #425d91!important; letter-spacing: -1.075px!important;}
.leftMenuMain > .tit_blue::before {background: url("../../images/icon_04i.png") no-repeat center / cover!important;}

.leftMenuMain ul, .leftMenuMain ul li {list-style-type:none; margin: 0; padding: 0;}
.leftMenu ul {width: 100%;}
.leftMenuMain > ul {margin: 0 0 54px 0;}
.leftMenuMain > ul ul {display: none; border-top: 1px solid #eee;}
.leftMenuMain ul li {position: relative; z-index: 1; line-height: 20px;}
.leftMenuMain ul li.current > ul {display: block; background-color: rgba(0, 0, 0, 0.1);}
.leftMenuMain ul li:last-child {border-bottom: 0;}
.leftMenuMain ul li::after {content: ''; height: 1px; background: #f0f0f0; position: absolute; bottom: 0; left: 9px; right: 9px;}
.menu_dot {position: absolute; top: 18px; right: -1px; z-index: 99; width: 30px; height: 30px; cursor: pointer;}
.menu_dot::before {content: ''; background: url("../../images/icon_04j.png") no-repeat center / cover; width: 15px; height: 9px; position: absolute; top: 10px; left: calc(50% - 7.5px); transition: all 0.5s ease 0s;}
.leftMenuMain .menu_dot_open::before {background: url("../../images/icon_04jr.png") no-repeat center / cover; top: 9px; transition: all 0.5s ease 0s;}
.leftMenuMain ul li:hover > .menu_dot::before {background: url("../../images/icon_04jr.png") no-repeat center / cover; top: 9px;}
.leftMenuMain a:link, .leftMenuMain a:visited {text-decoration:none; color:#222; letter-spacing: 0.1px; background-color: transparent; padding: 22px 30px 23px 17px; display: block; position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.leftMenuMain a:active, .leftMenuMain a:hover, .leftMenuMain a.menu_arrow_open {text-decoration:none; color:#d55446!important; font-weight: 600; padding: 21px 30px 23px 17px; cursor:pointer; transition: all 0.5s ease 0s;}

.ul_blue .menu_dot_open::before {background: url("../../images/icon_04jb.png") no-repeat center / cover!important;}
.ul_blue li:hover > .menu_dot::before {background: url("../../images/icon_04jb.png") no-repeat center / cover!important;}
.ul_blue a:active, .ul_blue a:hover, .ul_blue a.menu_arrow_open {text-decoration:none; color:#425d91!important; font-weight: 600; padding: 21px 30px 23px 17px; cursor:pointer; transition: all 0.5s ease 0s;}

.menu_arrow {position: absolute; top: 10px; left: 5px; width: 20px; height: 20px; -moz-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -ms-transform:rotate(0deg); transform:rotate(0deg); transition: all 0.5s ease 0s;}
.menu_arrow::before {content: ''; width: 7px; height: 2px; background-color: #000; border-radius: 2px; position: absolute; top: 7px; left: 6px; -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); transition: all 0.5s ease 0s;}
.leftMenuMain a:hover .menu_arrow::before, a.menu_arrow_open .menu_arrow::before, a.menu_arrow_open .menu_arrow::after {background-color: #fff; transition: all 0.5s ease 0s;}
.menu_arrow::after {content: ''; width: 7px; height: 2px; background-color: #000; border-radius: 2px; position: absolute; top: 11px; left: 6px; -moz-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg); transition: all 0.5s ease 0s;}
.leftMenuMain a:hover .menu_arrow::after {background-color: #fff; transition: all 0.5s ease 0s;}
.menu_arrow_open .menu_arrow {-moz-transform:rotate(90deg); -webkit-transform:rotate(90deg); -o-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg); transition: all 0.5s ease 0s;}
@media only screen and (min-width:993px){
    .leftMenuMobile {display: none!important;}
}
@media only screen and (max-width:992px){
    .leftMenu {max-width: 100%;}
    .leftMenuMain > .tit {padding: 20px 20px 20px 65px;}
    .leftMenuMain > .tit_blue {letter-spacing: 0.1px!important;}
    .leftMenuMobile {width: 30px; height: 30px; margin: 40px auto 10px auto; position: relative; cursor: pointer;}
    .leftMenuMobile > span:nth-child(1) {width: 30px; height: 2px; background-color: #000; position: absolute; top: 10px; left: 0; transition: all 0.5s ease 0s;}
    .leftMenu > div.show > span:nth-child(1) {top: 14px; transform: rotate(45deg);}
    .leftMenuMobile > span:nth-child(2) {width: 30px; height: 2px; background-color: #000; position: absolute; top: 20px; left: 0; transition: all 0.5s ease 0s;}
    .leftMenu > div.show > span:nth-child(2) {top: 14px; transform: rotate(-45deg);}
    .leftMenuMobile::before {content: attr(data-title); width: 200px; height: 30px; line-height: 30px; position: absolute; top: -30px; left: calc(50% - 100px); text-align: center; font-size: 12px; color: #000;}
    .leftMenu > div.leftMenuMain {max-height: 0; overflow: hidden; transition: all 0.5s ease 0s;}
    .leftMenu > div.open {max-height: 400px; overflow-y: auto; padding-bottom: 10px; transition: all 0.5s ease 0s;}
}
