@charset "utf-8";
#kv { background: url('/img/kv/magazine.jpg') no-repeat 50% 50% / cover;}

#magazine .inner-sct { width: 88%; margin: 0 auto; padding: 40px 0 80px;}

#magazine .read { position: relative; width: 100%; max-width: 940px; margin: 0 auto 80px;}
#magazine .read.pR{ padding-right: 250px;}
#magazine .read figure { position: absolute; right: 0; top: 0; width: 220px;}
#magazine .read figure img { width: 100%; max-width: 200px; box-shadow: 2px 2px 3px #ccc;}
#magazine .read p { font-size: 1.065rem; letter-spacing: 0.15rem;}
#magazine .read p.note { margin-top: 30px;}
#magazine .read p a { color: #000;}
#magazine .read p a:hover { text-decoration: none;}
#magazine .read ul { display: flex; justify-content: space-between; padding: 20px 0; text-align: center;}
#magazine .read ul li { width: 48.5%; padding: 10px 0; font-size: 1.0rem; line-height: 1;}
#magazine .read ul li a { position: relative; display: block; padding: 12px 0; padding-right: 1	2px; background: #00aa83; border-radius: 50px;
 color: #fff; font-weight: 700; text-decoration: none;
}
#magazine .read ul li a:after { content: ''; display: block; width: 10px; height: 10px;
 border-top: solid 2px #fff; border-right: solid 2px #fff;
 position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(45deg);
}
#magazine .read ul li a:hover { opacity: 0.8;}
#magazine p.note { font-size: 1.0rem;}
@media (max-width: 801px) {
	#magazine .read.pR{ padding-right: 180px;}
	#magazine .read figure { width: 160px;}
	#magazine .read p { font-size: 14px;}
	#magazine .read p.note { margin-top: 20px;}
	#magazine .read ul { display: block;}
	#magazine .read ul li { display: block; width: 100%; padding: 8px; font-size: 15px;}
	#magazine p.note { font-size: 13px;}
}
@media (max-width: 641px) {
	#magazine .read.pR{ padding-right: 0px;}
	#magazine .read figure { position: relative; left: auto; top: auto; width: 100%; margin-bottom: 30px; text-align: center;}
	#magazine .read figure img { width: 80%; max-width: 180px;}
	#magazine .read ul { padding: 10px 0;}
}
@media (max-width: 481px) {
	#magazine .inner-sct { padding: 20px 0 60px;}
	#magazine .read { margin: 0 auto 60px;}
	#magazine .read p { font-size: 0.812rem;}
	#magazine p.note { font-size: 0.812rem;}
}

#magazine .research { width: 100%; max-width: 960px; margin: 0 auto;}
#magazine .research .box { margin-bottom: 20px; padding: 0 20px; border: solid 2px #c7c7c7; border-radius: 6px;}
#magazine .research .box:last-child { margin-bottom: 0px;}
#magazine .research .box .box-tit { position: relative; padding: 27px 0;}
#magazine .research .box .box-tit:after { content: ''; display: block; width: 14px; height: 14px;
 border-top: solid 3px #00aa83; border-right: solid 3px #00aa83;
 position: absolute; right: 10px; top: 50%; transform: translateY(-50%) rotate(135deg);
}
#magazine .research .box .box-tit.open:after { transform: translateY(-25%) rotate(-45deg);}
#magazine .research .box .box-tit p { font-size: 24px; font-weight: 700; line-height: 1; text-align: center;}
#magazine .research .box .box-tit p span { display: block; padding-top: 8px; font-size: 14px; font-weight: 400;}
#magazine .research .box .box-ctn { display: none; padding: 25px 0 35px; border-top: dashed 2px #c2c2c2; }
#magazine .research .box .box-ctn ul { border: solid 1px #c8c8c8;}
#magazine .research .box .box-ctn ul li { border-bottom: solid 1px #c8c8c8;}
#magazine .research .box .box-ctn ul li:first-child { background: #00aa83; text-align: center; color: #fff;}
#magazine .research .box .box-ctn ul li:last-child { border-bottom: none;}
#magazine .research .box .box-ctn ul li dl { display: table; width: 100%; }
#magazine .research .box .box-ctn ul li dl dt,
#magazine .research .box .box-ctn ul li dl dd { position: relative; display: table-cell; padding: 10px 15px;}
#magazine .research .box .box-ctn ul li dl dt { width: 140px;}
#magazine .research .box .box-ctn ul li dl dd { border-left: solid 1px #c8c8c8;}
#magazine .research .box .box-ctn ul li dl dd { width: auto;}
#magazine .research .box .box-ctn ul li dl dd:last-child { width: 100px; font-size: 1.0rem; text-align: center;}
#magazine .research .box .box-ctn ul li:first-child dl dt,
#magazine .research .box .box-ctn ul li:first-child dl dd { font-size: 1.12rem; font-weight: 700;}
@media (max-width: 801px) {
	#magazine .research .box .box-tit p { font-size: 1.25rem;}
	#magazine .research .box .box-ctn ul li dl dt,
	#magazine .research .box .box-ctn ul li dl dd { font-size: 14px;}
	#magazine .research .box .box-ctn ul li dl dd:last-child { font-size: 0.812rem;}
	#magazine .research .box .box-ctn ul li:first-child dl dt,
	#magazine .research .box .box-ctn ul li:first-child dl dd { font-size: 1.0rem;}
	
}
@media (max-width: 641px) {
	#magazine .research .box .box-ctn ul li:first-child { display: none;}
	#magazine .research .box .box-ctn ul li dl dt,
	#magazine .research .box .box-ctn ul li dl dd { display: block; width: 100%; padding-left: 100px;}
	#magazine .research .box .box-ctn ul li dl dd { border-left: none; border-top: dashed 1px #c2c2c2;}
	#magazine .research .box .box-ctn ul li dl dt:before { content: '著書'; }
	#magazine .research .box .box-ctn ul li dl dd:before { content: '題目'; }
	#magazine .research .box .box-ctn ul li dl dd:last-child:before { content: 'ページ'; }
	#magazine .research .box .box-ctn ul li dl dt:before,
	#magazine .research .box .box-ctn ul li dl dd:before { position: absolute; left: 10px; top: 10px;	}
	#magazine .research .box .box-ctn ul li dl dd:last-child { width: 100%; text-align: left;}
	#magazine .research .box .box-ctn ul li dl dt br { display: none;}
}
@media (max-width: 481px) {
	#magazine .research .box { margin-bottom: 12px; padding: 0 10px;}
	#magazine .research .box .box-tit { padding: 16px 0;}
	#magazine .research .box .box-tit:after { width: 10px; height: 10px; border-width: 2px; right: 0px;}
	#magazine .research .box .box-tit p { font-size: 0.812rem;}
	#magazine .research .box .box-tit p span { font-size: 12px;}
	#magazine .research .box .box-ctn { padding: 15px 0 20px;}
	#magazine .research .box .box-ctn ul li dl dt,
	#magazine .research .box .box-ctn ul li dl dd { padding: 8px; padding-left: 60px; font-size: 12px;}
	#magazine .research .box .box-ctn ul li dl dd:last-child { font-size: 11px;}
	#magazine .research .box .box-ctn ul li dl dt:before,
	#magazine .research .box .box-ctn ul li dl dd:before { top: 8px;	}
}

