@charset "utf-8";
/* ------------------------------------------ */
/* HOME CSS */
/* ------------------------------------------ */
/* lorder --------------------------------*/
#opening-wrap {
    display: block;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    opacity: 1;
}

#opening-wrap.hide {
	display: none;
    opacity: 0;
}

#all-contents {
 	opacity: 0; 
}
#all-contents.show {
	opacity: 1;
	animation: reveal 1s forwards;
}
.m-loader_anm {
	position: absolute;
	width: 100%;
	height: 100%;
}

/* loader-square */
.loader-square {
	margin: auto;
	position: relative;
	top: 50%;
	margin-top: -25px;
	width: 75px;
    height: 75px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-ms-transform:rotate(45deg);
}

.loader-square div {
	display:inline-block;
	background-color: #007ebf;
	width:25px;
	height:25px;
	margin:0;
	padding:0;
}

.loader-square .box1 {
	-webkit-animation: animation1-box1 1.5s infinite;
	animation: animation1-box1 2s infinite;
	background-color: #080058;
}

.loader-square .box2 {
	-webkit-animation: animation1-box2 1.5s infinite;
	animation: animation1-box2 2s infinite;
}

.loader-square .box3 {
	-webkit-animation: animation1-box3 1.5s infinite;
	animation: animation1-box3 2s infinite;
}

.loader-square .box4 {
	-webkit-animation: animation1-box4 1.5s infinite;
	animation: animation1-box4 2s infinite;
}

@keyframes animation1-box1{
	40%	{ transform: translate(-25px, -25px) rotate(85deg);}
	50%	{ transform: translate(-25px, -25px) rotate(90deg);}
	100% { transform: translate(-0px, -0px) rotate(180deg);}
}

@-webkit-keyframes animation1-box1{
	40%	{ -webkit-transform: translate(-25px, -25px) rotate(85deg);}
	50%	{ -webkit-transform: translate(-25px, -25px) rotate(90deg);}
	100%{ -webkit-transform: translate(-0px, -0px) rotate(180deg);}
}

@-webkit-keyframes animation1-box2{
	40%	{ -webkit-transform: translate(50px, -25px) rotate(85deg);}
	50%	{ -webkit-transform: translate(50px, -25px) rotate(90deg);}
	100% { -webkit-transform: translate(-0px, -0px) rotate(180deg);}
}

@keyframes animation1-box2{
	40%	{ transform: translate(50px, -25px) rotate(85deg);}
	50%	{ transform: translate(50px, -25px) rotate(90deg);}
	100%{ transform: translate(-0px, -0px) rotate(180deg);}
}

@-webkit-keyframes animation1-box3{
	40%	{ -webkit-transform: translate(-50px, 25px) rotate(85deg);}
	50%	{ -webkit-transform: translate(-50px, 25px) rotate(90deg);}
	100%{ -webkit-transform: translate(-0px, -0px) rotate(180deg);}
}


@keyframes animation1-box3{
	40%	{ transform: translate(-50px, 25px) rotate(85deg);}
	50%	{ transform: translate(-50px, 25px) rotate(90deg);}
	100%{ transform: translate(-0px, -0px) rotate(180deg);}
}

@-webkit-keyframes animation1-box4{
	40%	{ -webkit-transform: translate(25px, 25px) rotate(85deg);}
	50%	{ -webkit-transform: translate(25px, 25px) rotate(90deg);}
	100%{ -webkit-transform: translate(-0px, -0px) rotate(180deg);}
}

@keyframes animation1-box4{
	40%	{ transform: translate(25px, 25px) rotate(85deg);}
	50%	{ transform: translate(25px, 25px) rotate(90deg);}
	100%{ transform: translate(-0px, -0px) rotate(180deg);}
}

.m-loader {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    width: 100%;
    height: 100%;
    background: #fff;
    background-size: 100% auto;	
    animation: reveal 0.5s both;
    animation-delay: 0.1s;
    /*-webkit-transition: visibility 0s;
    transition: visibility 0s;
    animation: revealbgimg 3.5s forwards;
    opacity: 0;
    animation-delay: 0.3s;*/
}

.m-loader::before {
	content:"";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/home/bg_loading.png) no-repeat center 50%;
    background-size: 100% auto;	
    animation: reveal 3s both;
    animation-delay: 0.4s;
}

.m-loader .loading-inner {
	position: relative;
	height: 100%;
	width: 100%;
}

.m-loader .loading-inner::before {
	content:"";
	display: block;
	position: absolute;
	left: 50%;
    top: 0;
    width: 35%;
    height: 130%;
	background: rgba(225,236,255,0.25);
    transform-origin: right top;
	animation: scrbgin 0.8s both;
	animation-delay: 0.5s;
}

@keyframes reveal {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes scrin {
  0% {opacity:0; transform: translateX(45px);}
  100% {opacity: 1; transform: translateX(0);}
}

@keyframes scrbgin {
  0% {transform: translate(230%,-150%) rotate(45deg);}
  100% {transform: translate(10%,0) rotate(45deg);}
}


.c-loader {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

.c-loader .img-loader.area-wkicons {
    width: 485px;
}

.c-loader .txt-loader {
	text-align: center;
	line-height: 1.8;
    /*opacity: 0;
    animation: reveal 7s forwards;
    animation-delay: 1.0s;*/
	padding-right: 5%;
}

.c-loader .txt-loader .f-yum {
	color: #080058;
	font-weight: 500;
	letter-spacing: 0;
    margin-bottom: 10px;
	animation: scrin 0.4s both;
	animation-delay: 1.2s;
	transition: none;
}

.c-loader .txt-loader .f-yum span {
	position: relative;
    top: 3px;
}

.c-loader .txt-loader .stxt-loader .t01 {
	letter-spacing: 1.5vw;
    white-space: nowrap;
    display: block;
    margin-bottom: 10px;
	animation: ease scrin 0.4s both;
	animation-delay: 1.5s;
}

.c-loader .txt-loader .stxt-loader {
	color: #000;
	margin-bottom: 25px;
	animation: ease scrin 0.4s both;
	animation-delay: 1.8s;
}

.c-loader .txt-loader .stxt-loader .t02 {
	font-weight: 700;
    letter-spacing: 1.5vw;
    line-height: 1.3;
	
}

.c-loader .txt-loader .stxt-loader .t02 span {
	letter-spacing: 1.5vw;
    display: block;
    font-weight: 700;
}

.c-loader .txt-loader .logo-loader {
	width: 75%;
	margin: 0 auto;
	animation: ease scrin 0.4s both;
	animation-delay: 2.1s;
}

.c-loader .txt-loader .logo-loader .t03 #txt-cname path {
	fill: #080058;
}

.c-loader .img-loader.area-wkicons .wk-icons .wk01,
.c-loader .img-loader.area-wkicons .wk-icons .wk02,
.c-loader .img-loader.area-wkicons .wk-icons .wk03,
.c-loader .img-loader.area-wkicons .wk-icons .wk04 {
    	animation: moverecbtn 1.8s ease;
		animation-fill-mode: both;
  		-webkit-animation-fill-mode: both;

}

.c-loader .img-loader.area-wkicons .wk-icons .wk01 {
		animation-delay: 2.1s;	
}

.c-loader .img-loader.area-wkicons .wk-icons .wk02 {
		animation-delay: 2.4s;	
}
.c-loader .img-loader.area-wkicons .wk-icons .wk03 {
		animation-delay: 2.7s;	
}
.c-loader .img-loader.area-wkicons .wk-icons .wk04 {
		animation-delay: 3.0s;	
}

@keyframes moverecbtn {
  0% {
	  transform: translateY(150%);
	  -webkit-transform: translateY(150%);
	  visibility: hidden;
	  opacity: 0;
  }
  60% {
	  transform: translateY(0%);
	  -webkit-transform: translateY(0%);	
	  visibility: visible;
	  opacity: 1;
	  
  }
  61% {
	  transform: rotateY(0deg);
	  -webkit-transform: rotateY(0deg);
	  opacity: 1;
  }
  100% {
	  transform: rotateY(360deg);
	  -webkit-transform: rotateY(360deg);
	  opacity: 1;
  }
}


.hide {
    display: none;
    opacity: 0;
}

@media (max-width: 1300px) {
	.c-loader {
		flex-direction: column;
	}
	.c-loader .img-loader.area-wkicons {
		width: 100%;
	}
	
	.c-loader .img-loader.area-wkicons .wk-icons {
		display: table;
		margin: 45px auto 0 auto;
    	width: auto;
	}
	
	.c-loader .txt-loader {
		padding-right: 0;
	}
	.c-loader .txt-loader .stxt-loader .t02 span {
		display: inline-block;
	}
	.c-loader .txt-loader .logo-loader {
		width: 50%;
	}
}
@media (max-width: 1025px) {
	.c-loader .img-loader.area-wkicons .wk-icons {
		width: 93%;
	}
}
@media (max-width: 900px) {
	.c-loader .img-loader.area-wkicons .wk-icons {
		width: 98%;
	}
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk .t-wk, .wk-icons .sbox-wk .t-wk span {
		font-size: 1.5rem;
	}
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk {
	    width: calc(25% - 10px);
	    height: 215px;
		margin-left: 5px;
    	margin-right: 5px;
	}
	
	.c-loader .img-loader.area-wkicons .wk-icons {
		width: 98%;
		margin: 30px auto 0 auto;
	}
	.c-loader .txt-loader {
		padding-top: 70px;
	}
	.c-loader .txt-loader .logo-loader {
		width: 45%;
	}
}

@media (max-width: 768px) {

	.c-loader .txt-loader {
		padding-top: 50px;
	}
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk .t-wk span {
		display: block;
	}
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk {
		padding-top: calc(8%*230/216);
		padding-bottom: calc(10%*230/216);
		margin-left: 2px;
    	margin-right: 2px;
		width: calc(25% - 4px);
	}
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk .icon img {
		height: 55px;
	}
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk .icon {
		margin-bottom: 0;
	}
	.c-loader .img-loader.area-wkicons .wk-icons {
		width: 98%;
	}
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk .t-wk, .wk-icons .sbox-wk .t-wk span {
		font-size: 1.4rem;
		line-height: 1.2;
	}
	
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk {
		
	}
}
@media (max-width: 600px) {
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk {
	    width: 150px;
	}
	.c-loader .img-loader.area-wkicons .wk-icons {
		width: 310px;
		margin-top: 20px;
	}
}
@media (max-width: 480px) {
	.c-loader .txt-loader {
		padding-top: 10px;
	}
	.c-loader .img-loader.area-wkicons .wk-icons {
		width: 90%;
		margin-top: 10px;

	}
	
	.c-loader .img-loader.area-wkicons .wk-icons .sbox-wk {
	    width: calc(50% - 10px);
	    height: auto;
	}
	.c-loader .txt-loader .logo-loader {
		width: 65%;
	}
	.c-loader .txt-loader .stxt-loader {
		margin-bottom: 10px;
	}
	.c-loader .txt-loader .stxt-loader .t01 {
		margin-bottom: 5px;
	}
	.c-loader .txt-loader .f-yum {
		margin-bottom: 5px;
	}
}


/* mainimgbox ----------------------------*/
.mainimgbox {
  position: relative;
  overflow-x: hidden;
}

.mainimgbox .sliderbox {
  width: 100%;
  margin: 0 auto;
}

.mainimgbox .sliderbox .slider {
  width: 100% !important;
  margin: 0 auto;
  padding-bottom: 10px;
}

.mainimgbox .sliderbox .slider img {
  width: 100%;
  display: block;
}

@media (max-width: 768px) {
	.mainimgbox {
		margin-top: 90px;
	}
}

/* topnews -------------------------------- */

.topnews {
	left: 6.5%;
	position: absolute;
  	right: 0;
  	bottom: 25px;
  	padding: 0 20px 0 20px;
	box-sizing: border-box;
	width: 100%;
	z-index: 100;
	visibility: hidden;
	opacity: 0;
	transform: translateX(101%);
	transition: all ease 0.5s;
	transition-delay: 0.2s;
}

.is-loaded .topnews {
	transform: translateX(0);
	opacity: 1;
	visibility: visible;
}

.topnews::after {
	content:"";
	position: relative;
	bottom: 0;
	height: 1px;
	width: 100%;
	display: block;
	background: rgba(0,0,0,0.15);
}

.topnews h2.f-rbc {
	color: #000;
	padding-left: 20px;
	padding-right: 20px;
}

.topnews .sbox-news a .cat {
	background: #136bc5;
	color: #fff;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック",sans-serif;
	font-weight: normal;
	font-size: 1.4rem;
	width: auto;
	padding: 2px 10px;
}

.topnews .sbox-news a .date {
	padding-left: 20px;
	padding-right: 20px;
}

.topnews .sbox-news a .txt {
	font-weight: bold;
	font-size: 1.6rem;
	color: #000;
	text-shadow: 1px 1px 0 #fff;
}
@media (max-width: 1199px) {
	.topnews {
		left: 5%;
	    width: 95%;
		padding-left: 0;
		padding-right: 0;
		position: relative;
		bottom: 0;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		margin-bottom: 20px;
		margin-top: 20px;
	}
	
}

@media (max-width: 991px) {
	.topnews .sbox-news {
		margin-right: 5%;
	}

	
}

@media (max-width: 768px) {
	.topnews .sbox-news {
		margin-right: 0;
	}
	.topnews h2.f-rbc,
	.topnews .sbox-news a{
		padding-left: 0;
		padding-right: 20px;
	}
	.topnews .sbox-news a {
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.topnews .sbox-news a .txt {
		font-size: 1.5rem;
	    font-weight: normal;
	}
}

/* sec-anniv
--------------------------------------------- */
#sec-anniv {
	position: relative;
}
#sec-anniv::before {
	position: absolute;
	content:"";
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: url(../img/home/90th-bg.jpg) no-repeat center bottom;
	background-size: cover;
	display: block;
	z-index: -1;
}

.main-annv {
	display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 390px;
	height: 390px;
	background: #fff;
	/*background: linear-gradient(#fff, #c1d8ec, #fff, #c1d8ec, #fff);
    background-size: 100% 100%;
    animation: bg-color2 9s infinite;
    -webkit-animation: bg-color2 9s infinite;
    animation-fill-mode: backwards;
    -webkit-animation-fill-mode: backwards;*/
	text-align: center;
	z-index: +1;
	overflow: hidden;
}

/* 90th logo svg */
.main-annv:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    /*background: linear-gradient( #f2f0e3, rgba(207,198,148,0.9), #f2f0e3,rgba(207,198,148,0.9),#f2f0e3);
    background-size: 100% 500%;
    animation: bg-color 9s infinite;
    -webkit-animation: bg-color 9s infinite;
    animation-fill-mode: backwards;
    -webkit-animation-fill-mode: backwards;*/
	opacity: 0.85;
	background: -moz-linear-gradient(to bottom,#cfc694,#f8f7f0 50%,#cfc694); 
	background: -webkit-linear-gradient(to bottom,#cfc694,#f8f7f0 50%,#cfc694); 
	background: linear-gradient(to bottom,#cfc694,#f8f7f0 50%,#cfc694); 
    z-index: -1;
}
.main-annv h2 {
	width: 72%;
}

.logoarea-90th {
	display: block;
	width: 100%;
	margin: 0 auto;
}

.logoarea-90th img {
	width: 100%;
}

/*@-webkit-keyframes bg-color {
	0%{background-position:0% 0%;opacity:0;}
	10%{background-position:0% 10%;opacity:1;}
	50%{background-position:0% 50%}
	96.5%{background-position:0% 100%;}
	100%{background-position:0% 100%;opacity:0;}
}
@keyframes bg-color {
	0%{background-position:0% 0%;opacity:0;}
	10%{background-position:0% 10%;opacity:1;}
	50%{background-position:0% 50%}
	96.5%{background-position:0% 100%;}
	100%{background-position:0% 100%;opacity:0;}

}

@-webkit-keyframes bg-color2 {
  0% { background-color: #f2f0e3; }
  30% { background-color: #dbd5af; }
  100% { background-color: #f2f0e3; }
}
@keyframes bg-color2 {
  0% { background-color: #f2f0e3; }
  30% { background-color: #dbd5af; }
  100% { background-color: #f2f0e3; }
}*/


/* 90th txt */
.main-annv h2 .f-crm,
.main-annv p { color: #000;}

.main-annv h2 > .txt-year {
	font-size: 17.5rem;
	position: relative;
	display: block;
	line-height: 0.8;
}

.main-annv h2 > .txt-year::after {
	content:"th";
	position: relative;
	font-size: 8.0rem;
	font-family: 'Crimson Text', serif;
    letter-spacing: 0;
}

.main-annv p {
	line-height: 1.5;
	font-weight: bold;
	margin-top: 15px;
}

.bg-anniv {
	position: relative;
	width: 100%;
    height: 100%;
	z-index: 0;
}
.bg-anniv .pic-l {
	display: inline-block;
	position: absolute;
}

.bg-anniv .pic01 {
	top: 5%;
	left: 0;
	max-width: 44%;
	width: 44%;
}

.bg-anniv .pic02 {
	max-width: 50%;
	width: 50%;
	bottom: 10%;
	right: 0;
}

#sec-anniv .t-anniv01,
#sec-anniv .t-anniv02 {
    display: table;
	width: auto;
	font-size: 3.5rem;
	color: #000;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif, sans-serif;
	font-weight: 500;
	z-index: +1;
    white-space: nowrap;
	text-align: left;
}

#sec-anniv .t-anniv01 {
    position: absolute;
	right: 2%;
    top: 10%;
	z-index: +1;
}

#sec-anniv .t-anniv02 {
	margin-bottom: 40px;
}

.annvtxt-bottom {
    position: absolute;
	left: 5%;
    bottom: 12%;
	display: table;
	padding: 70px 0 70px 0;
	white-space: nowrap;
	z-index: +1;
}

#sec-anniv .t-anniv01 .stxt01 {
	display: block;
	padding-left: 30%;
	font-weight: 500;
}

.logo-company {
    display: table;	
}
#sec-anniv .logo-company .block {
	margin-bottom: 3px;
}
#sec-anniv .logo-company .txtlogo1 {
	width: 162px;
	height: 26px;
}

#sec-anniv .logo-company .txtlogo2 {
	width: 335px;
	height: 38px;
}

@media (min-width: 1025px) {
	#sec-anniv,
	.bg-anniv {
		min-height: 850px;
	}
}

@media (max-width: 1199px) {
	.main-annv {
		width: 350px;
		height: 350px;
	}
	
	.annvtxt-bottom {
		padding: 0;
		bottom: 8%;
	}
	#sec-anniv .t-anniv02 {
		margin-bottom: 20px;
	}

}

@media (max-width: 1024px) {
	#sec-anniv,
	.bg-anniv {
		min-height: 750px;
	}
	.main-annv {
		width: 310px;
		height: 310px;
	}
	.main-annv h2 > .txt-year {
	    font-size: 15.0rem;
	}
	.annvtxt-bottom {
		padding: 0;
		bottom: 5%;
	}
	#sec-anniv .t-anniv01 {
		right: 1%;
	}
	#sec-anniv .t-anniv01, #sec-anniv .t-anniv02 {
		font-size: 3.1rem;
	}
	.bg-anniv .pic02 {
		bottom: 5%;
	}
	#sec-anniv .t-anniv01 .stxt01 {
		padding-left: 25%;
	}
}

@media (max-width: 820px) {
	#sec-anniv,
	.bg-anniv {
		min-height: 700px;
	}
	.main-annv {
		top: 0;
		transform: translate(-50%, 0);
	}
	.main-annv {
		width: 270px;
		height: 270px;
	}
	.main-annv h2 > .txt-year {
	    font-size: 12.5rem;	
	}
	.main-annv h2 > .txt-year::after {
	    font-size: 6.5rem;	
	}
	#sec-anniv .t-anniv01, #sec-anniv .t-anniv02 {
		display: block;
		font-size: 3.0rem;
	}
	
	#sec-anniv .t-anniv01 {
		top: 300px;
		width: 50%;
	}
	#sec-anniv .t-anniv01 .stxt01 {
		padding-left: 15%;
	}
	
	.bg-anniv .pic01 {
		top: 240px;
		left: 0;
		max-width: 40%;
		width: 40%;
	}
	
	.bg-anniv .pic02 {
		top: 440px;
		bottom: 0;
	}
	#sec-anniv .logo-company .txtlogo1 {
		width: 155px;
		height: 25px;
	}
	#sec-anniv .logo-company .txtlogo2 {
		width: 300px;
		height: 34px;
	}
	.annvtxt-bottom {
		bottom: 10%;
	}
}

@media (max-width: 740px) {
	#sec-anniv,
	.bg-anniv {
		min-height: 650px;
	}
	#sec-anniv .t-anniv01, #sec-anniv .t-anniv02 {
		font-size: 2.7rem;
	}
	#sec-anniv .logo-company .txtlogo1 {
		width: 120px;
		height: 19px;
	}
	#sec-anniv .logo-company .txtlogo2 {
		width: 250px;
		height: 28px;
	}
	.bg-anniv .pic02 {
		top: 420px;
	}
}

@media (max-width: 640px) {
	#sec-anniv, .bg-anniv {
		min-height: 620px;
	}
	#sec-anniv {
		padding-bottom: 20px;
	}
	.main-annv {
		width: 220px;
		height: 220px;
	}	
	.main-annv h2 > .txt-year {
		font-size: 9.5rem;
	}
	.main-annv h2 > .txt-year::after {
		font-size: 5.0rem;
	}
	.main-annv h2 .f-crm.f-sz40 {
		font-size: 3.0rem;
	}
	.main-annv p {
		font-size: 1.7rem;
		line-height: 1.4;
		margin-top: 2px;
	}
	.bg-anniv .pic01 {
		top: 190px;
	    max-width: 260px;
    	width: 260px;
	}
	.bg-anniv .pic02 {
		max-width: 400px;
    	width: 400px;
		top: 360px;
	}
	#sec-anniv .t-anniv01, #sec-anniv .t-anniv02 {
		font-size: 2.45rem;
	}
	#sec-anniv .t-anniv01 {
		top: 245px;
	}
	#sec-anniv .t-anniv01 .stxt01 {
		padding-left: 0;
	}
	.annvtxt-bottom {
		position: relative;
		margin-bottom: 20px;
		bottom: 0;
		width: 94%;
		left: 6%;
	}
	.logo-company {
		position: relative;
		right: 0;
	}
	#sec-anniv .t-anniv02 {
		margin-bottom: 10px;
	}
}

@media (max-width: 600px) {
	.main-annv {
		left: 5%;
		transform: translate(0, 0);
	}
	.bg-anniv .pic01 {
		top: 20px;
		left: 40%;
		max-width: 60%;
    	width: 60%;
	}
	#sec-anniv .t-anniv01 {
		width: 94%;
		top: 255px;
		right: 0;
		left: 6%;
	}
}

@media (max-width: 450px) {
	.main-annv {
		width: 180px;
		height: 200px;
	}
	.main-annv h2 > .txt-year {
		font-size: 18.5vw;
	}
	#sec-anniv, .bg-anniv {
	    min-height: 520px;
	}
	#sec-anniv {
		padding-bottom: 10px;
	}
	.bg-anniv .pic02 {
		max-width: 300px;
    	width: 300px;
	}
	#sec-anniv .t-anniv01 {
		top: 230px;
	}
	.bg-anniv .pic02 {
		top: 320px;
	}
	#sec-anniv .t-anniv01, #sec-anniv .t-anniv02 {
		font-size: 2.15rem;
	}
}

/* sec-business
--------------------------------------------- */
#sec-business {
  position: relative;
  overflow: hidden;	
}
@media (max-width: 1024px) {
	#sec-business .pic-l {
		padding-right: 5%;
	}
	#sec-business .c-right {
		padding-left: 5%;
	}	
	#sec-business .btnbox-l {
		text-align: center;
	}
	#sec-business .c-left .pic-l {
		padding-left: 5%;
		text-align: center;
		margin: 0 auto;
	}
	#sec-business .c-left .pic-l img {
		max-width: 550px;
	}
	
}
@media (max-width: 768px) {
	#sec-business .c-right {
		padding-left: 0;
	}	
	#sec-business .c-right .txt-area .sttl .f-w700 .sp-only-l {
		display: none !important;
	}
	#sec-business .c-left .pic-l img {
		max-width: 100%;
	}
}
@media (max-width: 480px) {
	#sec-business .c-left .pic-l {
		padding-left: 0;
		padding-right: 0;
		margin-left: -5%;
		margin-right: -5%;
	}
	
	.btnbox-l .mb10 {
		margin-bottom: 0;
	}	
}

/* sec-product
--------------------------------------------- */
#sec-product {
	overflow-x: hidden;
}

#sec-product .wrap {
	width: 100%;	
}


#sec-product .wrap .c-right {
    width: 765px;
    padding-left: 0;
    padding-right: 0;
}

@media (min-width: 991px) {
	#sec-product .wrap .c-left {
		padding-left: 6.5%;
	}

}
@media (max-width: 1300px) {
	#sec-product .wrap .c-left {
		padding-left: 6.0%;
	}
}
@media (max-width: 1280px) {

	#sec-product .wrap {
		width: 95%;
	}
	#sec-product .wrap .c-left,
	#sec-product .wrap .c-right {
		width: 100%;
	}
	
	#sec-product .wrap .listbox-product {
		width: calc(100% + 5px);
	}
	.cttlbox,
	.btn-onlybox,
	.c-left .f-noto {
		text-align: center;	
	}
}

@media (max-width: 1024px) {
	
	#sec-product .wrap {
		width: 90%;
	}
	#sec-product .wrap .c-right {
		width: 770px;
		margin: 0 auto;
	}
}

@media (max-width: 480px) {
	.c-left .t-catch {
		text-align: left;	
	}
}

/* sec-drawing
--------------------------------------------- */
.spointbox .s-dbpoint .stxt {
  text-align: center;
  font-weight: bold;
  font-size: 1.5rem;
  letter-spacing: 0;
  color: #000;
}
.spointbox .s-dbpoint .stxt span {
	font-size: 90%;
}

@media (min-width: 1260px){
	.spointbox {
		/*max-width: 1080px;*/
	}
	.spointbox .s-dbpoint {
	  width: 160px;
	  height: 160px;
	  margin: 0 10px 20px 10px;
	}	
}

@media (max-width: 1259px){
	#sec-drawing .wrap {
		width: 90%;
	}
	.spointbox .s-dbpoint {
	    margin: 0 0.6% 20px 0.6%;
		padding: 15px 0 25px 0;
		width: 15.366666666666%;
		box-sizing: border-box;
	}
}

@media (max-width: 1024px){
	#sec-drawing .wrap {
		width: 96%;
	}
	.spointbox .s-dbpoint {
	    margin: 0 0.5% 20px 0.5%;
		width: 15.466666666666%;
	}	
}

@media (max-width: 991px){
	.spointbox .s-dbpoint {
	    margin: 0 1% 15px %;
		width: 14.966666666666%;
	}
	.spointbox .s-dbpoint .stxt span {
		display: block;
	}	
}

@media (max-width: 850px){

	.spointbox .s-dbpoint .stxt {
		font-size: 1.4rem;
	}

}

@media (max-width: 768px){
	#sec-drawing .wrap {
		width: 90%;
	}
	.spointbox .s-dbpoint {
		width: 32.33333333%;
		margin-bottom: 8px;
	}	
}

@media (max-width: 480px){
	.spointbox .s-dbpoint {
		width: 49%;
		margin-bottom: 6px;
	}
	#sec-drawing .container-fluid > p.f-sz24.f-noto {
		font-size: 2.0rem;
		letter-spacing: 0;
	}
}

/* sec-news
--------------------------------------------- */
#sec-news {
	position: relative;
	overflow: hidden;
}

#sec-news::before {
    content: "";
    width: 400px;
    height: 300%;
    display: block;
    position: absolute;
    left: 20%;
    z-index: -1;
    top: -100%;
    transform: rotate(45deg);
    transform-origin: left top;
    background-color: #eef9ff;
}

.ttlbox-news {
	width: 240px;
	text-align: center;
	padding-top: 20px;
}

#home .box-newslist {
	width: calc(100% - 240px);
}

@media (max-width: 768px){
	.ttlbox-news,
	#home .box-newslist {
		width: 100%;
	}
	.ttlbox-news {
		padding-top: 0;
	}
}



/* sec-recruit
--------------------------------------------- */
#sec-recruit {
  position: relative;
}


#sec-recruit .c-left .t-msg {
  color: #d9ebef;
  letter-spacing: 0;
  text-align: right;
}
