@charset "utf-8";
/* CSS Document */
/* 
-------------------------------------------------- */
body {
	position: relative;
	font-size:10px;
	line-height: 1;
	font-family:'Noto Sans JP', YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	color: #222;
}
body picture { display:block;}
body img { width:100%; height:auto;}
.container a { text-decoration:underline; color: #000066;}
.container a:hover { text-decoration:none;}

.container {
	position:relative;
}
p.ctr {
	text-align:center;
}
.sub {
	font-size:12px !important;
}
.att {
	color: #6f0000 !important;
}

a.linkArrow01 {
	padding-right:2.2em;
	background:url("../img/common/arrow_01.svg") right 60% no-repeat;
	background-size:auto 6px;
	text-decoration:underline;
}
a.linkArrow01:hover { text-decoration:none;}

@media (min-width: 769px) {
/* tablet+PC用 */
	.for--sp { display: none;}
	
	.container {
		/*max-width:1080px;*/
		margin:0 auto;
	}
	.inner {
		/*max-width:1080px;*/
		width:92%;
	}
	
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
	.for--pc { display:none;}
	
	.container {
		overflow-x:hidden;
	}
}
@media (max-width: 480px) {
/* SP用 */
}


/* header
-------------------------------------------------- */
.header--logo {
	width:calc(100% - 120px);
	padding:4rem 0 0;
	transition:.5s;
}
.header--logo h1 {
	/*width:240px;*/
	/*text-align: center;*/
	transition:.5s;
}
.header--logo h1 a {
	/*display:block;
	margin:0 auto;*/
}
.header--logo h1 picture {
	display:inline-block;
}
.header--logo.fix {
	position:fixed;
	background:rgba(255,255,255,0.85);
	z-index: 3001;
}
@media (min-width: 769px) {
/* tablet+PC用 */
	.header--logo.fix {
		top:0;
		left:0;
		height: 120px;
		padding-top: 3em;
	}
	.header--logo h1 {
		margin-left: 8%;
	}
	.header--logo h1 img {
		width:240px;
	}
	.header--logo.fix h1 img {
		width:180px;
	}
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
	.header--logo {
		width:calc(100% - 60px);
		padding:4rem 0 0;
	}
	.header--logo h1 {
		text-align: left;
		padding-left:4%;
	}
	.header--logo h1 img {
		width:38.3%;
	}
	
	.header--logo.fix {
		padding: 0;
		height:60px;
	}
	.header--logo.fix h1 {
		padding-top:13px;
	}
	.header--logo.fix h1 img {
		width:auto;
		height:38px;
	}
}
@media (max-width: 480px) {
/* SP用 */
	.header--logo {
		padding:/*2.4rem*/13px 0 0;
		
	}
	.header--logo h1 {
		/*width:48.3%;*/
	}
	.header--logo.fix {}
}


/* menu
-------------------------------------------------- */
.menu-btn {
	position: fixed;
	/*position: absolute;*/
	top: 0rem;
    right: 0;
    width:60px;
    height: 60px;
	padding: 12px 10px;
    line-height: 50px;
    font-size: 12px;
    text-align: center;
    cursor: pointer;
    z-index: 151011;
	transition: all 0.6s;
	background:#1c3146;
}
.menu-btn span {
	color: #fff;
}
.open .menu-btn {}
.open .menu-btn span {
	color: #fff;
}
@media (min-width: 769px) {
/* tablet+PC用 */
	.menu-btn {
		width:120px;
    	height:120px;
		padding: 24px 20px;
    	line-height: 80px;
	}
}
/*.menu-btn span:after {
	content: attr(data-txt-menu);
}*/
/* 開閉用ボタンがクリックされた時のスタイル */
/*.open .menu-btn span:after {
	content: attr(data-txt-close);
}*/
.menu-trigger, .menu-trigger span {
	display: inline-block;
	transition: all .5s;
	box-sizing: border-box;
}
.menu-trigger {
	position: relative;
	width: 30px;
	height: 24px;
}
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #fff;
}
.m_fixed .menu-trigger span {
	background-color: #fff;
}
.menu-trigger span:nth-of-type(1) {
	top: 0px;
}
.menu-trigger span:nth-of-type(2) {
	top: 11px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 00px;
}
header .nav--inner { 
	position: fixed;
	top: 0px;
	right: -200%;
	width: 100%;
	height:100%;
	padding:80px 2.1em 5.6em 2.1em;
	line-height: 2.1;
	transition: all 0.6s;
	color: #fff;
	background: rgba(28,49,70,.9);
	z-index: 10001;
}
.open header .nav--inner {
	display: block;
	position: fixed;
	height: 100%;
	top: 0px;
	right: 0;
	z-index: 10001;
}
@media (min-width: 769px) {
/* tablet用 */
	header .global-nav {
	}
	header .nav--inner {
		width:380px;
		height:100%;
	}
}

header .nav--inner .main--nav {
	margin-bottom:6em;
}
header .nav--inner li {
	line-height:2.5;
}
header .nav--inner .main--nav li {
	position: relative;
	font-size:1.6em;
	font-weight:500;
}
header .nav--inner .main--nav li a {
	padding:0 1.8em 0 1.7em;
	color:#fff;
	background:url("../img/common/bg_li_01.svg") right center no-repeat;
	background-size:auto 54%;
	text-decoration: none;
}
header .nav--inner .main--nav a::before {
	content:'';
	position: absolute;
	left:0;
	top:50%;
	margin-top:-1px;
	height:2px;
	width: 8px;
	background:#fff;
}

.link--list {
	display: flex;
	align-items: center;
}
.link--list li {
	margin-right:24px;
	/*width:13%;*/
	width:10%;
}
.link--list li.twitter {
	width:9.7%;
}

header .menu-trigger span, 
.open .menu-trigger span {
	background-color: #fff;
}
.open .menu-trigger span:nth-of-type(1) {
	-webkit-transform: translateY(10.5px) rotate(-45deg);
	transform: translateY(10.5px) rotate(-45deg);
}
.open .menu-trigger span:nth-of-type(2) {
	opacity: 0;
}
.open .menu-trigger span:nth-of-type(3) {
	-webkit-transform: translateY(-10.5px) rotate(45deg);
	transform: translateY(-10.5px) rotate(45deg);
}

@media (min-width: 769px) {
	/* tablet用 */
	.menu-btn {
		
	}
}



/* footer
-------------------------------------------------- */
.totop {
	position:absolute;
	right:5%;
	bottom:4em;
	width:50px;
	height:50px;
	z-index: 13;
}
.totop:hover { cursor:pointer;}

.footer {
	padding: 3.6em 0 0;
	color: #fff;
	background:#1c3146;
}
.footer a {
	color:#fff;
}
.footer--logo img {
	width:247px;
}
.fotoer--nav {}
.ul--footer--nav {
	width:49%;
}
.ul--footer--nav:first-of-type {
	border-right:1px solid #fff;
}
.ul--footer--nav li {
	margin-bottom: 1.1em;
	font-size:1.2em;
	line-height: 1.25;
}
.ul--footer--nav li a {
	display: inline-block;
	position: relative;
	padding:0.5em 1.2em 0.5em 1.0em;
	color:#fff;
	background:url("../img/common/bg_li_01.svg") right center no-repeat;
	background-size:auto 11px;
	text-decoration: none;
}
.ul--footer--nav li a::before {
	content:'';
	position: absolute;
	left:0;
	top:50%;
	margin-top:-1px;
	height:2px;
	width: 6px;
	background:#fff;
}
.add--ttl {
	margin-bottom:1.2em;	
}
.add--ttl img {
	width:auto;
	height:20px;
}
.address p {
	font-size:1.1em;
	line-height:1.88;
}
.address a {	
	text-decoration: underline;
}

.copyright {
	clear: both;
	padding:1.5em 0;
	text-align: center;
	font-size:1.1em;
}

@media (min-width: 769px) {
/* tablet+PC用 */
	.footer--inner {
		display:flex;
		justify-content: space-between;
		margin:0 8%;
	}
	.footer--logo img {
		width:370px;
	}
	.fotoer--nav {
		display:flex;
	}
	.fotoer--nav ul {
		padding: 0 32px;
	}
	.fotoer--nav ul li {}
	.fotoer--nav ul li a {
		white-space: nowrap;
	}
	
	.link--list {
		justify-content: flex-end;
		float: right;
		margin: 5em 8% 0 0;
		width:160px;
	}
	.link--list li {
		width:41%;
		margin:0 0 0 30px;
	}
	.link--list li.twitter {
		width:38.5%;
	}
	
	.address {
		margin:-7em 0 0 8%;
	}
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
	.footer--logo {
		margin:0 0 3em 5%;
	}
	.fotoer--nav {
		display:flex;
		justify-content:space-between;
		margin: 3em 5% 3em;
	}
	.fotoer--nav ul {
		width:47.5%;
	}
	.footer .link--list {
		margin:4.6em 5%;
	}
	.address {
		margin: 3em 5% 1.6em;
	}
}
@media (max-width: 480px) {
/* SP用 */
}


/* parts
-------------------------------------------------- */
h2 {
	position:relative;
	z-index: 7;
}
h2 img {
	width:auto;
	height:45px;
}
.whats--area h2 img {
	height:100px;
}


h3 {
	position: relative;
	color: #6f0000;
	font-size:2.4em;
	font-weight: 700;
	z-index: 3;
}
h3 span {
	display:inline-block;
	position: relative;
}
h3 span::before {
	content:'';
	position:absolute;
	left:-0.5em;
	top:80%;
	width:calc(100% + 1em);
	height:8px;
	margin-top: -1px;
	border-radius: 10px;
	background:linear-gradient(/*transparent */#ffcd46 0%, #ffcd46 100%);
	z-index: 1;
}
h3 em {
	position:relative;
	z-index: 5;
}

.h401 {
	position:relative;
	margin: 0 auto 4.6em;
	text-align: center;
	line-height: 1.4;
}
.h401 span {
	position:relative;
	display: inline-block;
}
/* left bottom */
.h401 span::before {
	content: '';
	position:absolute;
	left:0;
	bottom:0;
	width:18px;
	height:12px;
	border-bottom:1px solid #6f0000;
	border-left:1px solid #6f0000;
}
/* right bottom */
.h401 span::after {
	content: '';
	position:absolute;
	right:0;
	bottom:0;
	width:18px;
	height:12px;
	border-bottom:1px solid #6f0000;
	border-right:1px solid #6f0000;
}

.h401 span em {
	position:relative;
	display: inline-block;
	padding:0.6em 1.03em 0.5em;
	color: #6f0000;
	font-size:2.3em;
	font-weight: 900;
}
/* left top */
.h401 span em::before {
	content: '';
	position:absolute;
	left:0;
	top:0;
	width:18px;
	height:12px;
	border-top:1px solid #6f0000;
	border-left:1px solid #6f0000;
}
/* right top */
.h401 span em::after {
	content: '';
	position:absolute;
	right:0;
	top:0;
	width:18px;
	height:12px;
	border-top:1px solid #6f0000;
	border-right:1px solid #6f0000;
}
/* 24/12/16 for more/current */
.h401 span small {
	display: block;
    margin-top: -.9em;
    font-size: 13px;
    font-weight: normal;
	color: #6f0000;
}

.h402 {
	position: relative;
	margin: -1.2em 0 1.3em;
	text-align: center;
	color: #6f0000;
	font-size:2.4em;
	font-weight: 700;
	z-index: 3;
}


.h501 {
	position: relative;
	margin:0.8em 0 2em;
	font-size:1.7em;
	font-weight: 700;
	text-align: center;
	letter-spacing: 0.2em;
	z-index: 3;
}
.h501 span {
	display:inline-block;
	position: relative;
}
.h501 span::before {
	content:'';
	position:absolute;
	left:-0.5em;
	top:50%;
	width:calc(100% + 1em);
	height:6px;
	margin-top: -1px;
	border-radius: 10px;
	background:linear-gradient(/*transparent */#fff 0%, #fff 100%);
	z-index: 1;
}
.h501 em {
	position:relative;
	z-index: 5;
	color:#1c3146;
}


.marker {
	display:inline-block;
	position: relative;
}
.marker::before {
	content:'';
	position:absolute;
	left:-0.5em;
	top:80%;
	width:calc(100% + 1em);
	height:5px;
	margin-top: -1px;
	border-radius: 10px;
	background:linear-gradient(/*transparent */#ffcd46 0%, #ffcd46 100%);
	z-index: -1;
}

@media (min-width: 769px) {
/* tablet+PC用 */
	h2 img {
		width:auto;
		height:60px;
	}
	.whats--area h2 img {
		height:60px;
	}
	
	h3 {
		font-size:3.3em;
	}
	
	.h401 span em {
		font-size:3em;
	}
	
	.btn--viewmore img {
		width:auto;
		height:34px;
	}
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
	.home .btn--viewmore {
		border-bottom:1px solid #6f0000;;
	}
	.btn--viewmore img {
		width:auto;
		height:28px;
	}
}
@media (max-width: 480px) {
/* SP用 */
}


/* even
-------------------------------------------------- */
.even {
	position: relative;
}
.even .inner {}
.even h2 {
	position: relative;
}
.even h2 picture {
	position:absolute;
	top:-10px;
	left:4%;
	z-index: 3;
}
.even h2::before {
	content:'';
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:1px;
	background:#6f0000;
	z-index: 1;
}
.even h2::after {
	content:'';
	position: absolute;
	top:0;
	right:0;
	width:10px;
	height:48px;
	background:#6f0000;
	z-index: 1;
}

.even h3 {
	margin-left:calc(8% + 0.5em);
	margin-bottom: 1em;
}

/* odd
-------------------------------------------------- */
.odd {
	position: relative;
}
.odd .inner {}
.odd h2 {
	position: relative;
}
.odd h2 picture {
	position:absolute;
	top: -10px;
	right: 4%;
	text-align: right;
	z-index: 3;
}
.odd h2::before {
	content:'';
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:1px;
	background:#6f0000;
	z-index: 1;
}
.odd h2::after {
	content:'';
	position: absolute;
	top:0;
	left:0;
	width:10px;
	height:48px;
	background:#6f0000;
	z-index: 1;
}

.odd h3 {
	margin-right:calc(8% + 0.6em);
	margin-bottom: 1em;
	text-align: right;
}

/* btn--viewmore
-------------------------------------------------- */
@media (min-width: 769px) {
/* tablet+PC用 */
	.container {
		background:url("../img/bg_body_pc.png") center bottom no-repeat;
		background-size: 60% auto;
	}
	.even .inner,
	.odd .inner {
		border-bottom:1px solid #6f0000;
	}
	.even .inner {
		border-right:1px solid #6f0000;
	}
	.odd .inner {
		margin-left: 8%;
		border-left:1px solid #6f0000;
	}
	
	section .fx {
		display:flex;
		justify-content: space-between;
	}
	.even h2::before,
	.odd h2::before {
		/*top:5px;*/
	}
	.even h2 picture,
	.odd h2 picture {
		top:-15px;
	}
	
	.fx .img {
		width:32%;
		max-width:400px;
	}
	.fx .cont {
		width:68%;
	}
	.even .fx .cont {
		padding:11em 3em 10em 15%;
	}
	.odd .fx .cont {
		padding:11em 15% 10em 3em;
	}
	.odd .fx .cont p {
		text-align:right;
	}
	
	.even .fx {
		flex-direction: row-reverse;
	}
	.even h2 picture {
		left:15%;
	}
	.odd h2 picture {
		right:15%;
	}
	
	.even h3 {
		margin-left:0.6em;
	}
	.odd h3 {
		margin-right:0.6em;
	}
	
	.btn--viewmore {
		text-align: right;
	}
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
	
	.even .inner {
		position: relative;
		margin-right: 8%;
		border-right:1px solid #6f0000;
	}
	
	.odd .inner {
		position: relative;
		margin-left: 8%;
		border-left:1px solid #6f0000;
	}
	
	.even .btn--viewmore {
		text-align: right;
	}
}
@media (max-width: 480px) {
/* SP用 */
}






/* news--area
-------------------------------------------------- */

.ul--news--list {
	margin-bottom: 6em;
}
.ul--news--list li {
	border-bottom:1px dashed #6f0000;
}
.ul--news--list li:last-of-type {
	border:none;
}
.ul--news--list li a {
	display:block;
	padding:1.2em 0.8em;
}
.ul--news--list li a:hover {
	background:#ebe6d2;
	border-radius: 8px;
}
.ul--news--list li dl {
	line-height: 1.65;
}
.ul--news--list li dl dt {
	font-size:1.3em;
}
.ul--news--list .icn {
	display:inline-block;
	width:8em;
	margin-right:0.8em;
	color: #fff;
	text-align: center;
	background:#1c3146;
}
.ul--news--list .date {
}
.ul--news--list li dl dd {
	padding-top: 0.5em;
	font-size:1.4em;
}

.news--area .btn--viewmore {
	position: relative;
	text-align:right;
}
.news--area .btn--viewmore::before {
	content:'';
	position: absolute;
	left: -6%;
    top: -35px;
    width: 34%;
    height: 100px;
	background:url("../img/duo_news_illust01.png") center top no-repeat;
	background-size:100% auto;	
}

@media (min-width: 769px) {
/* tablet+PC用 */
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
}
@media (max-width: 480px) {
/* SP用 */
}

/* animation
-------------------------------------------------- */
@keyframes rotation01 {
	0%{ transform:rotate(0);}
	100%{ transform:rotate(360deg); }
}
@keyframes rotation02 {
	0%{ transform:rotate(0);}
	100%{ transform:rotate(-360deg); }
}
@keyframes move-y01 {
	0%{ transform:translateY(0);}
	50%{ transform:translateY(10px); }
	100%{ transform:translateY(0);}
}
@keyframes zoom-out-anim {
	0%   { transform: scale(1.05);}
	25%  { transform: scale(1);}
	26%  { transform: scale(1.05);}
	67%  { transform: scale(1);}
	68%  { transform: scale(1.05);}
	100% { transform: scale(1);}
}

@keyframes zoom-out-anim02 {
	0%   { transform: scale(0.98);}
	13.5%  { transform: scale(0.95);}
	14%  { transform: scale(0.98);}
	55.5%  { transform: scale(0.94);}
	56%  { transform: scale(0.98);}
	77.5%  { transform: scale(0.96);}
	78%  { transform: scale(0.98);}
	99.5%  { transform: scale(0.96);}
	100% { transform: scale(0.98);}
}



/* 
-------------------------------------------------- */
@media (min-width: 769px) {
/* tablet+PC用 */
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
}
@media (max-width: 480px) {
/* SP用 */
}


/* 
-------------------------------------------------- */
@media (min-width: 769px) {
/* tablet+PC用 */
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
}
@media (max-width: 480px) {
/* SP用 */
}


/* 
-------------------------------------------------- */
@media (min-width: 769px) {
/* tablet+PC用 */
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
}
@media (max-width: 480px) {
/* SP用 */
}


/* 
-------------------------------------------------- */
@media (min-width: 769px) {
/* tablet+PC用 */
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
}
@media (max-width: 480px) {
/* SP用 */
}


/* 
-------------------------------------------------- */
@media (min-width: 769px) {
/* tablet+PC用 */
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
}
@media (max-width: 480px) {
/* SP用 */
}



/* effects
-------------------------------------------------- */
.fadein {
	opacity : 0;
	transform: translateY(40px);
	transition: all 2000ms ;
}
.dalay05s {
	animation-delay: 0.5s;
}
.dalay10s {
	animation-delay: 1s;
}
@media (min-width: 769px) {
/* tablet+PC用 */
}
@media (min-width: 1024px) {
/* PC用 */
}
@media (min-width: 1400px) {
/* PC-wide用 */
}
@media (min-width: 769px) and ( max-width: 1023px) {
/* tablet用 */
}
@media (max-width: 768px) {
/* tablet用 */
}
@media (max-width: 480px) {
/* SP用 */
}


