@charset "UTF-8";
/* CSS Document */

html,body {
    width: 100%;
    margin:0;
    padding:0;
    color:#000000;
    background-color:#FFFFFF;
    font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
    -moz-font-feature-settings: "palt";
    font-feature-settings: "palt";
    font-size: 15px;
    line-height: 210%;
}

img {
    width: 100%;
    margin:0;
    padding:0;
    line-height: 0%;
}

a {
    color:#000000;
    text-decoration: none;
}


a:hover {
    text-decoration: underline;
}

.wrapper {
    width: 100%;
    margin:0;
    padding:0;
    position: relative;
    overflow: hidden;
}

.header-base {
    background-image:url("/_files/00459662/hdr_base.png");
    background-size: contain;
    background-position: top;
    background-repeat: no-repeat;
}

.header {
    width: 100%;
    margin:0 0 30px;
    padding:0;
    position: relative;
    z-index: 100;
}

.header-sp {
    display: none;
}

.header .header-wrap {
    width: 95%;
    margin:0 auto;
    padding:10px 0 0;
    position:relative;
	display: flex;
	justify-content: space-between;
    align-items: center;
}

.header-logo {
    width: 20%;
    float: none;
    margin:0;
    padding:0;
}

.header-nav {
    width: 100%;
    margin:0;
    padding:5px 0 20px;
    position: relative;
    background-color:#000000;
}

.header-nav .hdr-nav-wrap {
    width: 95%;
    margin:0 auto;
    padding:0;
    position:relative;
}

.header-nav nav {
	width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	overflow: visible;
}


* {
  box-sizing: border-box;
}

#navbox {
    width: 95%;
    margin:0 auto;
    padding:0;
    list-style: none;
    background-color:#000000;
    color:#FFFFFF;
    font-weight: 400;
    font-size: 0;
    display:flex;
    justify-content: space-between;
    text-align: center;
}

#navbox li.nav-item {
  font-size: 1.0rem;
  font-weight: bold;
  display: inline-grid;
  position: relative;
  padding: 10px 0 0;
  cursor: pointer;
  z-index: 5;
  width: auto;
  transition: .2s ease-in;
    -moz-transition: .2s ease-in;
    -webkit-transition: .2s ease-in;
    -o-transition: .2s ease-in;
    border-bottom:solid 3px transparent;
}

#navbox li.nav-item:hover {
    border-bottom:solid 3px #fff400;
}

#navbox li.nav-item a.navmain-link {
    color:#FFFFFF;
    text-decoration: none;
}

#navbox li.nav-out a {
    display: flex;
    justify-content: center;
    align-items: center;
}
#navbox li.nav-out a:after {
    content: "";
    width: 15px;
    height: 10px;
    margin: 0 0 0 10px;
    display: inline-block;
    background-image: url(/_files/00532228/hdr_icon-outside.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

li {
  margin: 0;
}

ul.drop {
    width: 100%;
    margin:0;
    padding: 0;
    position: absolute;
    overflow: hidden;
    left: 0;
    top: 50px;
    min-width: 160px;
    list-style: none;
    
}
ul.drop .drop-wrap {
    width: 96%;
    margin:0 auto;
    padding:10px 0;
    position: relative;
    overflow: hidden;
    background: #fff400 !important;
    -webkit-transform: translate(0, -100%);
    -moz-transform: translate(0, -100%);
    -ms-transform: translate(0, -100%);
    transform: translate(0, -100%);
    -webkit-transition: all 0.5s 0.1s;
    -moz-transition: all 0.5s 0.1s;
    -ms-transition: all 0.5s 0.1s;
    transition: all 0.5s 0.1s;
}

ul.drop li.drop-item {
  width: 100%;
  margin:0;
  padding:0;
  position:relative;
  overflow: hidden;
  font-size: 75%;
  font-weight: bold;
  text-align: left;
  transition: .2s ease-in;
	-moz-transition: .2s ease-in;
	-webkit-transition: .2s ease-in;
	-o-transition: .2s ease-in;
}

ul.drop li.drop-item a {
    width: 98%;
    height: 100%;
    margin:0 auto;
    padding:5px 1%;
    display: block;
    color:#000000 !important;
    text-decoration: none;
    transition: .2s ease-in;
	-moz-transition: .2s ease-in;
	-webkit-transition: .2s ease-in;
	-o-transition: .2s ease-in;
}

ul.drop li.drop-item:hover {
    background-color:#000000;
}


ul.drop li.drop-item:hover a {
    color:#FFFFFF !important;
}

#marker {
  height: 6px;
  background: #fff400 !important;
  position: absolute;
  bottom: 0;
  width: 18%;
  max-width: 150px;
  z-index: 2;
  -webkit-transition: all 0.35s;
  -moz-transition: all 0.35s;
  -ms-transition: all 0.35s;
  transition: all 0.35s;
}

#navbox li.nav-item:nth-child(1):hover ul.drop .drop-wrap {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

#navbox li.nav-item:nth-child(2):hover ul.drop .drop-wrap {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}


#navbox li.nav-item:nth-child(3):hover ul.drop .drop-wrap {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

#navbox li.nav-item:nth-child(4):hover ul.drop .drop-wrap {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

#navbox li.nav-item:nth-child(5):hover ul.drop .drop-wrap {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

#navbox li.nav-item:nth-child(6):hover ul.drop .drop-wrap {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}



.nav-icons {
    width: 20%;
    max-width: 150px;
    margin:0;
    padding:0;
}

ul.nav-icons-wrap {
    width: 100%;
    margin:0;
    padding:0;
    position: relative;
    display: flex;
    justify-content: space-between;
    list-style: none;
}

ul.nav-icons-wrap li.navico-item {
    width: 28%;
    display: flex;
    opacity: 1.0;
    transition: .2s ease-in;
    -moz-transition: .2s ease-in;
    -webkit-transition: .2s ease-in;
    -o-transition: .2s ease-in;
}

ul.nav-icons-wrap li.navico-item:hover {
    opacity: 0.5;
}


.footer {
    width: 100%;
    margin:0;
    padding:0;
    position:relative;
    overflow: hidden;
    background-color:#e7e7e7;
    background-image:url("/_files/00459624/ftr_bk.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.footer .footer-wrap {
    width: 90%;
    max-width: 1200px;
    margin:10px auto;
    padding:0;
    position: relative;
    overflow: hidden;
}

.footer .sns-area {
    width: 20%;
    max-width: 140px;
    float: right;
    margin:0;
    padding:0;
}

.sns-area ul.sns-list {
    width: 100%;
    margin:0;
    padding:0;
    position: relative;
    overflow: hidden;
    list-style: none;
    display: flex;
    justify-content: space-between;
}

ul.sns-list li.sns-item {
    width: 25%;
}

.ftr-main {
    width: 100%;
    margin:50px 0 0;
    padding:0;
    position: relative;
    overflow: hidden;
    text-align: center;
}

.ftr-main .center-name {
    font-size: 210%;
    line-height: 100%;
    font-weight: bold;
}

.ftr-main .center-sm {
    margin:0 0 30px;
    font-size: 80%;
    font-weight: normal;
}

.ftr-main .center-address {
    font-size: 100%;
    line-height: 160%;
    margin:0 0 30px;
    display: block;
}

.ftr-main .copyright {
    font-size: 80%;
}

.pagetop {
    width: 4%;
    max-width: 62px;
    height: 79px;
    position: fixed;
    bottom: 260px;
    right: 0px;
    z-index: 1200;
}

.pagetop img {
    width: 100%;
    opacity:1.0;
    transition: .2s ease-in;
	-moz-transition: .2s ease-in;
	-webkit-transition: .2s ease-in;
	-o-transition: .2s ease-in;
}

.pagetop img:hover {
    opacity:0.8;
}

.pagetop:hover {
    cursor:pointer;
}



/***NEWS***/

.contentArticleDoc h1 {
	font-size: 180%;
}

.publishedAt {
	width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	overflow: hidden;
	text-align: right;
	font-weight: bold;
}

.contentArticleDoc h1 {
	width: 100%;
	margin: 0 0 10px;
	padding: 0 0 10px;
	position: relative;
	overflow: hidden;
	border-bottom: solid 5px #000;
}

.contentArticleDoc .header {
	margin: 0 0 30px;
}

.contentArticleDoc .body {
	min-height: 400px;
}

/***** SUB BASE *****/


h1.pagetitle {
    width: 100%;
    margin:0 0 50px;
    padding:0;
    position: relative;
    overflow: hidden;
    top:0;
    font-size: 150%;
    line-height: 180%;
    font-weight: bold;
    text-align: center;
}

h1.pt-manual {
	font-size: 280%;
}

h1.pagetitle .pieceHeader {
    display: none;
}

h1.pagetitle h2 {
    font-size: 100%;
    line-height: 100%;
}

.pankuzu {
    width: 95%;
    max-width: 1100px;
    margin:0 auto;
    padding:0;
    position: relative;
    overflow: hidden;
    font-size: 75%;
    line-height: 140%;
    color:#b1b1b1;
}

.pankuzu a {
    text-decoration: none;
    color:#b1b1b1;
    border-bottom:solid 1px transparent;
    transition: .2s ease-in;
	-moz-transition: .2s ease-in;
	-webkit-transition: .2s ease-in;
	-o-transition: .2s ease-in;
}

.pankuzu a:hover {
    color:#ff5555;
    border-bottom:solid 1px #ff5555;
}

.pankuzu #pageTitle {
    display: inline-flex;
}

.pankuzu .pieceContainer .pieceHeader {
    display: none;
}

.pankuzu .pieceBody h1 {
    display: inline;
    font-size: 100%;
    font-weight: normal;
}


.main {
    width: 100%;
    min-height: 800px;
    margin:0;
    padding:100px 0;
    position:relative;
    overflow: hidden;
}

.main-wrap {
    width: 95%;
    max-width: 1100px;
    margin:0 auto;
    padding:0;
    position: relative;
    overflow: hidden;
}

.left-menu-area {
    width: 23%;
	max-width: 300px;
    margin:0 2% 0 0;
    padding:0;
    float: left;
    border:solid 5px #000000;
    border-radius: 5px;
}

.left-menu-area .menu-title {
    width: 100%;
    margin:0;
    padding:20px 0;
    position: relative;
    overflow: hidden;
    background-color:#000000;
    color:#FFFFFF;
    text-align: center;
    font-size: 110%;
    font-weight: bold;
}

.left-menu-area ul.menu-list {
    width: 100%;
    margin:0;
    padding:0;
    position: relative;
    overflow: hidden;
    list-style: none;
    font-size: 100%;
    font-weight: bold;
}

.left-menu-area ul.menu-list li.menu-item {
    width: 100%;
    margin:0;
    padding:0;
    position: relative;
    overflow: hidden;
    border-bottom:solid 3px #000000;
    text-align: left;
    background-color:#FFFFFF;
    transition: .2s ease-in;
	-moz-transition: .2s ease-in;
	-webkit-transition: .2s ease-in;
	-o-transition: .2s ease-in;
}

.left-menu-area ul.menu-list li.menu-item:last-child {
    border-bottom: none;
}

.left-menu-area ul.menu-list li.menu-item:hover {
    background-color:#fff300;
}

ul.menu-list li.menu-item a {
    width: 100%;
    height: 100%;
    display: block;
    padding:20px 5%;
    color:#000000;
    text-decoration: none;
}

.right-content-area {
    width: 75%;
    float: right;
    margin:0;
    padding:0;
}

.right-content-area .right-main-wrap {
    width: 100%;
    margin:0;
    padding:0;
    position:relative;
    overflow: hidden;
}

.right-content-area .intro-txt {
    width: 95%;
    margin: 0 auto 100px;
    padding:0;
    position: relative;
    overflow: hidden;
    font-size: 140%;
    font-weight: bold;
    line-height: 210%;
}

.right-content-area .introsub-txt {
    width: 95%;
    margin: 0 auto 30px;
    padding:0;
    position: relative;
    overflow: hidden;
    font-size: 120%;
    font-weight: bold;
    line-height: 210%;
}

h2.pagecont-mds {
    width: 100%;
    margin:0 0 50px;
    padding:0;
    position:relative;
    overflow: hidden;
    text-align: center;
    font-size: 180%;
    line-height: 160%;
    font-weight: bold;
    border-bottom:dotted 6px #000000;
}

h2.pagecont-mds:before {
    content: url("/_files/00459716/mdspage_tmark.png");
    width: 15%;
    margin:0 auto;
    padding:0;
    margin-block-start:0;
    margin-block-end:0;
    position:relative;
    overflow: hidden;
    display: block;
}

h3.sec-mds {
    width: 100%;
    margin:30px 0;
    padding:0;
    position:relative;
    overflow:hidden;
    border-bottom:dotted 4px #000000;
    font-size: 180%;
    font-weight: bold;
    line-height: 210%;
}

h3.sec-mds:before {
    background-image: url(/_files/00459709/mds-sec.png);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    width: 50px;
    height: 40px;
    content: "";
    margin: 0 10px 0 0;
}

h5.mds-square {
    width: 100%;
    margin:20px 0;
    padding:0;
    position:relative;
    overflow: hidden;
    font-size: 140%;
    font-weight:bold;
    line-height:180%;
}

h5.mds-square:before {
    content: '■';
    color:#aed950;
    font-size: 120%;
}

.mds-sm {
    font-size: 70%;
}

.sec-txt {
    width: 100%;
    margin: 0 0 30px;
    padding:0;
    position:relative;
    overflow: hidden;
    font-size: 110%;
    font-weight: normal;
    line-height: 210%;
}

.sec-txt ol {
    font-size: 90%;
}

ul.pinkdots-list {
    width: 100%;
    margin:0;
    padding:0;
    position:relative;
    overflow: hidden;
    font-size: 110%;
    line-height:210%;
}

ul.pinkdots-list li.pinkdots-item {
    width: 90%;
    margin: 0 auto;
    padding: 0;
    position: relative;
    list-style-image: url(/_files/00459617/bullet-pink.png);
}

ul.sublist li {
    list-style: disc;
}

/*****アーカイブ*****/

h5.archive-title {
    width: 94%;
    margin:50px auto 20px;
    padding:0 3% 10px;
    position: relative;
    overflow: hidden;
    font-size: 180%;
    font-weight: bold;
    text-align: left;
    border-bottom:solid 5px #d8d8d8;
    color: #557b00;
}

ul.archive-list {
    width: 90%;
    margin:0 auto 50px;
    padding:0;
    position: relative;
    list-style-image: url(/_files/00459617/bullet-pink.png);
    font-weight: bold;
}

ul.archive-list li.archive-item {
    width: 90%;
    margin:0 auto 5px;
    padding:0;
    position: relative;
}

ul.archive-list li.archive-item a {
    text-decoration: underline;
    color: #000000;
}

.backtoindex {
    width: 25%;
    float: right;
    margin:100px 0 0;
    padding:0;
    text-align: center;
    background-color:#000000;
    color:#FFFFFF;
    font-size: 100%;
    font-weight:bold;
    transition: .2s ease-in-out;
	-moz-transition: .2s ease-in-out;
	-webkit-transition: .2s ease-in-out;
	-o-transition: .2s ease-in-out;
}

.backtoindex a {
    width: 100%;
    height: 100%;
    padding:10px 0;
    display: block;
    color:#FFFFFF;
    text-decoration: none;
    transition: .2s ease-in-out;
	-moz-transition: .2s ease-in-out;
	-webkit-transition: .2s ease-in-out;
	-o-transition: .2s ease-in-out;
}

.backtoindex:hover {
    background-color:#FBF000;
    border-radius: 15px;
}

.backtoindex:hover a {
    color:#000000;
}


.underconstruction {
    width: 80%;
    margin:0 auto;
    padding:100px 0;
    position: relative;
    display: block;
    border:dotted 4px #6d6d6d;
    text-align: center;
    font-size: 140%;
    font-weight: bold;
    line-height: 210%;
    color:#272727;
}

/*****PV Image Video*****/
.pv-area {
  width: 100%;
  margin: 0;
  padding: 60px 0;
  position: relative;
  overflow: hidden;
}

.pv-area .pv-wrap {
  width: 98%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.pv-area h3.pv-title {
  width: 80%;
  max-width: 600px;
  margin: 0 auto 30px;
}

.pv-area .yt-wrap {
  width: 80%;
  margin: 0 auto 30px;
  padding: 20px 2%;
  position: relative;
  overflow: hidden;
  background-color: #000;
  border-radius: 30px;
  display: flex;
}

.pv-area .yt-wrap iframe {
  width: 90%;
  height: 400px;
  margin: 0 auto !important;
  text-align: center;
  align-content: center;
  align-items: center;
}

.pv-area .yt-txt {
  text-align: center;
  font-size: 100%;
  font-weight: bold;
}


