@charset "utf-8";
/*
Theme Name: 愛知県共済2016 ライフプラススマホ用CSS
Copyright: 愛知県共済
Author: kcc
Version: 1.1
*/

/*非表示*/
.search,.fontSizeChange,.headerNav,.topicpath,.bnr,footer nav{
	display:none;
}
/*フロート解除など*/
.lifeplusMainLeft,.lifeplusContent,.lifeplus aside,footer .inner{
	float:none;
	width:auto;
	padding:0;
}

/*
共通
*/
body{
	position:relative;
	font-size:14px;
	line-height:160%;
}
img{max-width:100%;}
header{height:45px;}
header .inner{
	padding:5px 10px 5px 10px;
	height:35px;
	width:100%;
}
header h1 img{height:34px;}

footer{
	position:fixed;
	left:0;
	bottom:0;
	padding:0;
	height:58px;
	width:100%;
	border:none;
	background:#FAF0DC;
	z-index:1000;
}

footer nav.spfn{display:block;}
footer nav.spfn ul{
	display:table;
	margin:auto;
	width:100%;
	border-collapse:collapse;
}

footer nav.sp ul li{
	display:table-cell;
	width:33%;
	text-align:center;
}
footer nav.spfn ul li a{
	display:block;
	height:36px;
	width:100%;
	margin:0;
	padding:0;
	font-size:16px;
	font-weight:bold;
	line-height:2.4em;
	letter-spacing:3px;
	color:#FFF;
	text-align:center;
	text-decoration:none;
	background:#E8380D;
	border-left:1px solid #FFF;
}
footer nav.spfn ul li:first-child a{border-left:none;}
.copyright{
	float:none;
	font-size:10px;
	text-align:center;
}

.pagetop{
	position:fixed;
	bottom:64px;
	right:10px;
	height:47px;
	width:47px;
}
.pagetop a{
	display:block;
	height:47px;
	width:47px;
	content:url(../images/sp/common/btn_pagetop.png);
}
.pagetop a:before{
	margin:0;
	padding:0;
	content:'';
}

.spgn{
	display:block;
	position:absolute;
	top:0;
	right:0;
	z-index:2000;
}
.spgn .btn{
	position:absolute;
	top:0;
	right:0;
	margin:0 0 0 0;
	width:46px;
	height:46px;
	text-align:right;
	color:#0F0;
}
.spgn .btn img{
	width:46px;
	height:46px;
}
.spgn ul{
	position:absolute;
	top:43px;
	right:0;
	padding:2px	0 0 0;
	box-shadow:-5px 5px 10px rgba(0, 0, 0, 0.2);
	width:280px;
}
.spgn ul li{
	display:block;
	margin:0;
	background:#FFF url(../images/sp/common/nav_icon.png) right center no-repeat;
	background-size:25px 12px;
	border-bottom:1px solid #E8380D;
}
.spgn ul li:last-child{
	border-bottom:none;
}
.spgn ul li a{
	display:block;
	padding:9px 0px 9px 18px;
	font-size:15px;
	font-weight:bold;
	letter-spacing:1px;
	color:#E8380D;
}

.overlay{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.3);
	z-index:1500;
}

/*
ライフプラス
*/
/*
ライフプラストップ
*/
.lifeplusHeader h2{
	float:none;
	display:block;
	padding:0;
	text-align:center;
}

.lifeplusContent article.lifeplusHeader h2 img{
	float:none;
	display:inline-block;
	margin:10px auto;
	width:149px;
}

.lifeplusHeader p{
	padding:10px 0;
	font-size:14px;
	line-height:150%;
}

.lifeplusMainLeft h3{
	margin:0 0 5px 0;
	font-size:16px;
}
.lifeplusList article a{
	padding:5px 0;
	overflow:hidden;
	zoom:1;
}
.lifeplusTop .lifeplusContent .lifeplusMainLeft article img{
	float:left;
	display:inline-block;
	margin:0 5px 0 0;
	width:98px;
}
.service .lifeplusList h4{
	float:none;
	display:inline;
	width:auto;
	font-size:14px;
	font-weight:normal;
	line-height:150%;
}
.lifeplusList .lifeplusMainLeft article p{
	display:none;
}
.lifeplusList article a:after{
	content:'';
}
/*
ライフプラス記事
*/
.lifeplusMainLeft h3{background-size:100% 2px;}
.lifeplus article h3:before{content:'';}

.lead2{
	display:none;
}
.lifeplusContent{
padding:10px 10px 100px;
border:9px solid #E85377;
border-bottom:none;
}
.lifeplusContent article img{
	display:inline-block;
	margin:10px auto 30px;
	width:275px;
}

.lifeplusDetailHeader h2{
	margin:0 0 10px 0;
	padding:0 0 10px 0;
	color:#444;
	font-size:16px;
	line-height:150%;
	font-weight:bold;
	border-bottom:1px solid #CCC;
}

.lifeplusDetail article p{line-height:170%;}
.lifeplusDetailHeader{
	background:url(../images/service/lifeplus/line01.gif) left bottom no-repeat;
	background-size:100% 2px;
}
.lifeplusDetail article{margin-bottom:40px;}

.btmNavi{
	display:table;
	margin:20px auto;
}
.btmNavi a{
	margin:0;
	font-size:20px;
	line-height:150%;
}
.btmNavi .nextPage2,
.btmNavi .prevPage2{
	width:auto;
}
.btmNavi .nextPage2 a:before,
.btmNavi .prevPage2 a:after{
	content:'';
}
.btmNavi .nextPage2 a,.btmNavi .prevPage2 a{
	padding:3px 5px;
	font-size:180%;
	line-height:100%;
}
.rank{
	border:none;
}
.rank h5{
	padding:10px 0 5px 0;
	font-size:16px;
	line-height:130%;
	font-weight:bold;
	color:#444;
	background:none;
	background:url(../images/service/lifeplus/line01.gif) left bottom no-repeat;
	background-size:100% 2px;
}
.rank ul{
	padding:6px 0 0;
}
.rank ul li a{
	padding:0 0 6px 0;
	font-size:14px;
	line-height:150%;
	border-bottom:1px solid #999;
}
.rank ul li img{
	width:98px;
}
.rank ul li.no1:after,
.rank ul li.no2:after,
.rank ul li.no3:after,
.rank ul li.no4:after,
.rank ul li.no5:after{
	width:18px;
	height:27px;
	background-size:18px 27px;
}

article.reference{
	margin:30px auto;
}

/* 20240920 */
#grandMenu ul{margin:0;padding:0;}

/* common */
:root {
 --c-red:#e8380d;
 --c-orange:#ee7800;
 --c-orange-dark: #7e3800;
}

#quickLink, #grandMenu { -webkit-box-sizing: border-box;  box-sizing: border-box;}
#quickLink :before, #grandMenu :before,  #quickLink :after, #grandMenu :after {  -webkit-box-sizing: border-box;  box-sizing: border-box;}

.pc {display: none !important;}
.sp {display: block!important;}
a:hover { text-decoration: none !important;}

#quickLink p, #grandMenu p{margin: 0;}

/* ----------------------------------------------------
調整
---------------------------------------------------- */
header{overflow: visible !important; height: auto;width: 100%;position: fixed;z-index:1000;}
.header {-webkit-box-sizing: content-box;  box-sizing: content-box; font-weight: 400;  }
#quickLink a  {color: #333; text-decoration: none;}
#quickLink a:hover{text-decoration: none;}
#quickLink em {font-style: normal;}
header nav img {width:100%; height: auto;}

header .header {position: fixed; left: 0; top: 0; width: 100%; z-index: 10; background: #FAF0DC; height: 35px;}

/* ----------------------------------------------------
quickLink (common)
---------------------------------------------------- */
.bg {width: 100%; height: calc(100% - calc(90px + min(4.67vw,56px) + 1px) ); background: rgba(0,0,0,0.25); position: fixed; left: 0; top:calc(90px + min(4.67vw,56px) + 1px); display: none; z-index: 2;}
.bg.is_active{display: block;}

#btnGlobal, #grandMenu {display: none;}

#quickLink {width: 100%; border-top: 1px solid var(--c-red); border-bottom:1px solid var(--c-red); position: relative; background: #fff; transition: 0.3s all ease-in-out; font-size: min(1.3vw, 16px);}
#navQuick {width: 90%; max-width: 1000px; margin: 0 auto; display: flex; display: -webkit-flex;}
#navQuick > li {flex: 1;display: flex; display: -webkit-flex; border-left: 1px solid #c0c0c0; font-weight: 600; cursor: pointer;}
#navQuick > li:last-child {letter-spacing: -0.08em; border-right: 1px solid #c0c0c0;}
#navQuick > li:nth-child(4) span {width:212px;}

#navQuick > li span {flex: 1;display: flex; display: -webkit-flex; align-items: center; justify-content: center; height: min(4.67vw,56px); position: relative; line-height: 1.3; font-weight: 600; }
#navQuick > li.is_active, #navQuick > li.current{background: var(--c-red); color: #fff;}
#navQuick > li > span::before {content: ""; background: url("/assets/img/common/ic-arrow-01.svg") center center / cover no-repeat; aspect-ratio: 240/150; width: min(1.08vw,13px); position: absolute; left: 50%; bottom:min(0.4vw,5px); transform: translate(-50%,0); }
#navQuick > li.is_active span::before, #navQuick > li.current span::before{background-image: url("/assets/img/common/ic-arrow-02.svg");}

.navQuick__list {position: absolute; left: 0; top: calc(min(4.67vw,56px) + 1px); background: #fff url("/assets/img/common/bg-navQuickLink-01.svg") left top / min(5vw,6px) auto repeat; width: 100%; z-index: 10; padding: min(3.3vw,40px) 0 min(4.16vw,50px); display: none;}
.navQuick__wrap {width: 90%; max-width: 1000px; margin: 0 auto; display: flex; display: -webkit-flex; flex-wrap: wrap;column-gap: 2%; position: relative;}
.navQ__link {width: 32%;background: #fff; box-shadow: 3px 3px 5px 0 rgba(0,0,0,0.2); border-radius: min(0.66vw,8px); }
.navQ__link:not(:nth-child(-n+3)) {margin-top: 2%;}

.navQ__link a {font-size: min(1.25vw,15px); padding: min(1.25vw, 15px) min(2.5vw, 30px); position: relative; min-height: min(8.5vw,102px); display: flex; display: -webkit-flex; align-items: center; transition: 0.3s all ease-in-out;}

.navQ__brand .navQ__link a {padding: min(1.25vw, 15px) min(1.25vw, 15px) min(0.83vw, 10px) min(1.25vw, 15px) ; display: block;}
.navQ__brand .navQ__link a .navQ__catch {margin-bottom: min(0.6vw,8px); line-height: 1.4; font-weight: 600;}
.navQ__link .navQ__brand {position: absolute; top: 50%; transform: translateY(-50%);}
.navQ--0101 h2 img {width: min(10.58vw,127px);}
.navQ--0101 .navQ__brand {width: min(7.08vw,85px); right: min(1.25vw, 15px);}
.navQ--0102 h2 img {width: min(17.72vw,209px);}
.navQ--0102 .navQ__brand {width: min(3.83vw,46px); right: min(1.66vw, 20px); top: inherit; transform: none; bottom: 0;}
.navQ--0103 h2 img {width: min(17.72vw,209px);}
.navQ--0103 .navQ__brand {width: min(7.33vw,88px); right: min(0.4vw, 5px); }
.navQ--0104 h2 img {width: min(12.83vw,154px);}
.navQ--0104 .navQ__brand {width: min(7.08vw,85px); right: min(1.25vw, 15px);}
.navQ--0105 h2 img {width: min(14.17vw,170px);}
.navQ--0105 .navQ__brand {width: min(5.5vw,66px); right: min(1.25vw, 15px);}

.navQ__link h2 {font-size: min(1.75vw,21px); line-height: 1.5; font-weight: 600;}
.navQ__link h2 em {display: block;}
.navQ__icon {position: absolute; right: min(2.5vw,30px); top: 50%; transform: translateY(-50%); width: min(4.16vw,50px);}

.navQ__close {position: absolute; right: 0; bottom:0; transform: translateY(150%); background: #fff; color: #333; font-size: min(1.08vw,13px); padding: min(0.4vw, 5px) min(0.4vw, 5px) min(0.4vw, 5px) min(2.5vw, 30px); line-height: 1;}
.navQ__close::before, .navQ__close::after {content: ""; width: min(1.25vw, 15px); height: 1px; background: #333; position: absolute; transform-origin: center center; left: min(0.4vw,5px); top: 50%; }
.navQ__close::before {transform: rotate(45deg);}
.navQ__close::after {transform: rotate(-45deg);}


#wrapper {overscroll-behavior: none;}
.bodyFixed {height: 100vh;overflow: hidden;}
.bg {height: 100%; top: 0; }

#btnGlobal {position: fixed; right: 0; top: 0; height: 45px; width: 45px; display: flex; display: -webkit-flex; justify-content:center; align-items: center; flex-direction: column; z-index: 40;}
#btnGlobal .btnWrapGlobal { width: 30px; height: 20px; position: relative;}
#btnGlobal .btnLine { height:3px; background:var(--c-red); position: absolute; left: 50%; transform: translateX(-50%); width: 100%; transform-origin: center center;}
#btnGlobal .btnLine.btnLineT { top: 0;}
#btnGlobal .btnLine.btnLineM { top: 50%; transform: translate(-50%,-50%);}
#btnGlobal .btnLine.btnLineB { bottom: 0; }
#btnGlobal p {text-align: center; font-size: min(2.8vw, 12px); color: var(--c-red); font-weight: 600; line-height: 1; margin: 3px 0 0; }

#btnGlobal.active {background: #fff;}
#btnGlobal.active .btnLine {width: 90%;}
#btnGlobal.active .btnLine.btnLineT { display: none;}
#btnGlobal.active .btnLine.btnLineM { transform: translate(-50%,-50%) rotate(45deg) ;}
#btnGlobal.active .btnLine.btnLineB { top: 50%; bottom:inherit; transform: translate(-50%,-50%) rotate(-45deg) ;}
#btnGlobal .btnLine.btnLineM, #btnGlobal .btnLine.btnLineB {transition: all, ease-in-out, 0.3s;}

#grandMenu {background: rgba(0,0,0,0.25); width: 100%; height:100vh; position: fixed; z-index:30; left: 0; top: 45px; display: none; overflow: auto; padding: 0 0 10vw;}
#grandMenu .navGlobal {background: #fff;}
#grandMenu .navGlobal li { border-bottom: 1px solid var(--c-red); font-weight: 600; font-size: min(4vw, 18px);}
#grandMenu .navGlobal li a {display: block; padding: min(3vw, 25px) min(4vw, 30px); position: relative;text-decoration: none; }
#grandMenu .navGlobal li a::before {content: ""; position: absolute; right: min(4vw,30px); top: 50%; transform: translateY(-50%); aspect-ratio: 75/150; width: min(2vw,12px);background-position: center center; background-size: cover; background-repeat: no-repeat;}
#grandMenu .navGlobal__main a {color: var(--c-red);}
#grandMenu .navGlobal__sub a {color: #333;}
#grandMenu .navGlobal__sub li:last-child {border-bottom: 0;}
#grandMenu .navGlobal__main a::before{background-image: url("../assets/img/common/ic-arrow-03.svg");}
#grandMenu .navGlobal__sub a::before{background-image: url("../assets/img/common/ic-arrow-04.svg");}


#quickLink {position: fixed; left: 0; top: 45px; z-index: 10;}
#navQuick {width: 100%; font-size: min(3vw,18px); line-height: 1.2;  }
#navQuick > li:first-child {border-left: none;}
#navQuick > li:nth-child(4) span{width: 88px;}
#navQuick > li:last-child {letter-spacing: -0.08em; border-right: none;}
#navQuick > li span {height: min(12vw,70px); text-align: center; padding-bottom: min(1vw,5px);}
#navQuick > li > span::before {width: min(2vw,14px); bottom:min(1vw,3px); }

.navQuick__list {background-size: min(2vw,12px) auto; padding: min(7vw,50px) 0 ; z-index: 20;}
.navQuick__wrap {column-gap: 0;}
.navQ__link {width: 100%; border-radius: min(2vw,8px); }
.navQ__link:not(:first-child) {margin-top: min(1vw,10px);}
.navQ__link a {font-size: min(3vw,2.4rem); padding: min(2vw, 15px) min(4vw, 30px); min-height: min(16vw,70px);}

.navQ__brand .navQ__link a {padding: min(2vw, 15px) min(4vw, 30px);}
.navQ__brand .navQ__link a .navQ__catch {margin-bottom: min(1.5vw,15px);}

.navQ--0101 h2 img {width: min(23vw,172px);}
.navQ--0102 h2 img {width: min(38vw,283px);}
.navQ--0103 h2 img {width: min(38vw,283px);}
.navQ--0104 h2 img {width: min(51vw,379px);}
.navQ--0105 h2 img {width: min(31vw,232px);}
.navQ__brand img {width:auto; height: 100%;}
.navQ__link .navQ__brand {width: inherit; height: 90%; right: min(9vw, 70px);}
.navQ--0102 .navQ__brand {width: inherit; right: min(13vw, 95px);}

.navQ__link h2 {font-size: min(4vw,24px); }
.navQ__link h2 em {display: inline-block; margin-left: 1em;}
.navQ__icon {right: min(6vw,45px); width: min(10vw,72px);}

.navQ__close {bottom: max(-7vw, -50px); padding: min(7.5vw,60px) 0 0; transform: translateY(130%); aspect-ratio: 50/65; width: min(7vw,50px); font-size: min(2vw,1.7rem); text-align: center; color: #fff; background: transparent;}
.navQ__close::before, .navQ__close::after {content: ""; width: min(7vw, 50px); height: 3px; background: #fff; position: absolute; transform-origin: center center; left: 50%; top: 20%; }
.navQ__close::before {transform: translate(-50%)rotate(45deg);}
.navQ__close::after {transform: translateX(-50%)rotate(-45deg);}

@keyframes fadeup {
  0% {transform: translateY(100%);}
  100% {transform: translateY(0);}
 }

}