@charset "utf-8";

/* ============================================================
	研究所TOP 記事詳細
	============================================================ */


/* 記事メイン
	============================================================ */
@media screen and (min-width: 751px) {
	#article {
		width: 800px;
		margin: 5px auto 0;
		color: #333333;
		font-size: 17px;
		line-height: 24px;
		position: relative;
	}
	#article #subhead{
		font-size: 15px;
		line-height: 15px;
		display: block;
		overflow: hidden;
		margin: 20px 0 40px 0;
	}
	#article .cat {
	   float: left;
	   display: inline-block;
	}
	#article .date {
		float: right;
		display: inline-block;
	}
	#article h1,
	.article_title_top {
		font-size: 36px;
		line-height: 48px;
		margin: 15px 0;
		font-weight: normal;

	}
	#article #author {
		text-align: center;
		margin:40px auto 20px;
		font-size: 16px;
	}
	#article .subTitle {
		font-size: 20px;
		margin-top: 10px;
	}
	#article #date {
		font-size: 17px;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	#blog_title {
		font-size: 17px;
		font-weight: bold;
	}
	#article #top_text {
		font-size: 17px;
		line-height: 24px;
		margin: 40px 0 40px;
		padding: 19px 0 18px;
		border-top: 1px solid #cccccc;
		border-bottom: 1px solid #cccccc;
	}
	#article .blockTemplateArea:after {
		content: "";
		display: block;
		clear: both;
	}
	#article .blockTemplateArea .headLv2-A{
		margin: 40px 0 40px;
	}
	#article .blockTemplateArea .headLv2-A h2 {
		font-size: 22px;
		line-height:26px;
		border-left:8px solid;
		padding-left:12px;
	}
	#article .blockTemplateArea .headLv3-A{
		margin: 40px 0 40px;
	}
	#article .blockTemplateArea .headLv3-A h3 {
		font-size: 20px;
		line-height:26px;
	}
	#article .figureBlock,  #article .figureBlock-floated-L,  #article .figureBlock-floated-R,  #article .figureBlock-floated-L + p {
		margin: 25px 0 20px;
	}
	#article .blockTemplateArea .figureBlock-floated-L {
		padding-right: 30px;
	}
	#article .blockTemplateArea .figureBlock table tr > td:first-child {
		padding-left: 0;
	}

	#article .chushaku p{
		margin-top:5px;
		margin-bottom:1.5em;
		font-size: 14px;
		line-height:20px;
		color: #666;
	}

	#article .inyo{
		margin: 30px 0;
	}

	#article .inyo p{
		background-color:#f7f7f7;
		padding:20px;
		margin: 10px;
		font-size: 16px;
		line-height:22px;
	}

	#article .kakomi{
	    margin: 2rem 0;
		padding: 2rem 1rem;
		border: 2px  #ddd solid;
	}

	#article .articleBottom{
	/*
		margin: 40px auto 20px;
		width:700px;
	*/
		margin: 40px 80px 20px;
	}
	#article .figureBlock td + td {
		margin-left : 10px;
	}
	#article .figureBlock td.twtf{
		width:288px;
		height: 114px;
		border:3px solid #55acee;
		text-align:center;
		vertical-align: inherit;
	}
	#article .figureBlock td.lineff{
		width:288px;
		height: 114px;
		border:3px solid #55acee;
		text-align:center;
		vertical-align: inherit;
	}
	#article_sns {
		width: 1000px;
		margin: 0 auto;
		height: 25px;
		text-align: center;
		padding: 15px 0 20px;
		border-bottom: 1px dotted #aeaeae;
	}

	#article_sns li {
		display: inline-block;
		margin: 0 3px;
	}
}


@media screen and (max-width: 750px) {
	#article{
		margin: 0px 10px 20px;
		min-width : 300px;
	}

	#article .cat {
		text-align: left;
		float: left;
		/* margin:1px 0; */
	}

	#article .date {
		text-align:right;
		margin:0;
		line-height: 12px;
		/* margin:8px 0; */
	}
	#article h1,
	.article_title_top {
		font-size: 1.3rem;
		margin: 1.5rem 0 1rem 0;
		/* padding-top: 10px; */
		line-height: 1.7rem;
	}
	#article #author {
		text-align: center;
		font-size: 0.8rem;
		margin-bottom: 0.5rem;
	}
	#article #author img{
		width:70px;
	}
	#article #top_text {
		font-size: 14px;
		line-height: 17px;
		margin-top: 1rem;
		padding: 1rem 0;
		border-top: 1px solid #d2d2d2;
		/* border-bottom: 1px solid #d2d2d2; */
	}
	#article .chushaku p {
		padding-bottom:10px;
		font-size: 12px;
		line-height:17px;
		color: #666;
	}
	#article .inyo {
		margin: 0 0 20px;
	}
	#article .inyo p {
		background-color:#f7f7f7;
		padding: 10px;
		margin: 5px;
		font-size: 14px;
		line-height:22px;
	}
	#article .kakomi {
	    margin: 2rem 0;
		padding: 2rem 1rem;
		border: 2px  #ddd solid;
	}
	#article .articleBottom {
		margin: 40px auto 20px;
	}
	#article .figureBlock {
		text-align: center;
		margin: 1rem 0;
	}
	#article .figureBlock tr,
	#article .figureBlock th {
		display: block;
		width:100%;
	}
	#article .figureBlock td{
		margin-top:10px;
		display: inline-block;
	}
	#article .figureBlock td.fbf{
		width: 300px;
		display: inline-block;
		margin: 10px auto;
	}
	#article .figureBlock td.twtf{
		display: inline-block;
		width: 288px;
		height: 118px;
		border:3px solid #55acee;
		padding: 3px;
		text-align:center;
		vertical-align: inherit;
	}
	#article .figureBlock td.linef {
		display: inline-block;
		width: 288px;
		height: 118px;
		border:3px solid #55acee;
		padding: 3px;
		text-align:center;
		vertical-align: inherit;
	}
	#article .figureBlock-floated-L,
	#article .figureBlock-floated-R {
		padding: 0;
		width: 100%;
		margin-bottom: 0;
		text-align: center;
	}
}


/* 本文領域
	============================================================ */
/* 陣でイタリック装飾した際に、イタリックではなく、少し大きい文字を表示するようにする */
.blockTemplateArea p em {
	font-style : normal !important;
	font-size : 1.5rem;
	line-height : 4rem;
}
/**
  * bulmaスタイルのキャンセル
  *
  * 画像の横並びレイアウトが崩れないようにするため
  */
.blockTemplateArea .image img {
	width : auto;
}
@media screen and (min-width: 751px) {
	.blockTemplateArea:after {
		content: "";
		display: block;
		clear: both;
	}
	.blockTemplateArea .headLv2-A{
		margin: 40px 0 40px;
	}
	.blockTemplateArea .headLv2-A h2 {
		font-size: 22px;
		line-height:26px;
		border-left:8px solid;
		padding-left:12px;
	}
	.blockTemplateArea .headLv3-A{
		margin: 40px 0 40px;
	}
	.blockTemplateArea .headLv3-A h3 {
		font-size: 20px;
		line-height:26px;
	}
	.blockTemplateArea .figureBlock-floated-L {
		padding-right: 30px;
	}
	.blockTemplateArea .figureBlock table tr > td:first-child {
		padding-left: 0;
	}
}
@media screen and (max-width: 750px) {
	.blockTemplateArea div,
	.blockTemplateArea span,
	.blockTemplateArea object,
	.blockTemplateArea iframe,
	.blockTemplateArea h1,
	.blockTemplateArea h2,
	.blockTemplateArea h3,
	.blockTemplateArea h4,
	.blockTemplateArea h5,
	.blockTemplateArea h6,
	.blockTemplateArea p,
	.blockTemplateArea blockquote,
	.blockTemplateArea pre,
	.blockTemplateArea a,
	.blockTemplateArea abbr,
	.blockTemplateArea acronym,
	.blockTemplateArea address,
	.blockTemplateArea em,
	.blockTemplateArea font,
	.blockTemplateArea img,
	.blockTemplateArea strong,
	.blockTemplateArea sub,
	.blockTemplateArea sup,
	.blockTemplateArea dl,
	.blockTemplateArea dt,
	.blockTemplateArea dd,
	.blockTemplateArea ol,
	.blockTemplateArea ul,
	.blockTemplateArea li,
	.blockTemplateArea fieldset,
	.blockTemplateArea form,
	.blockTemplateArea label,
	.blockTemplateArea legend,
	.blockTemplateArea table,
	.blockTemplateArea caption,
	.blockTemplateArea tbody,
	.blockTemplateArea tfoot,
	.blockTemplateArea thead,
	.blockTemplateArea tr,
	.blockTemplateArea th,
	.blockTemplateArea td {
		margin: 0;
		padding: 0;
		font-size: 14px;
		line-height:1.6em;
	}
	#article .blockTemplateArea {
		padding: 0;
	}
	#article .blockTemplateArea p{
		/* padding-top:5px; */
	}
	#article .blockTemplateArea p.caption{
		margin:0;
		padding:0;
	}
	.blockTemplateArea table {
		width: 100%;
	}
	.blockTemplateArea .figureBox td.figureBox-textArea {
		margin:0;
		padding:0;
	}
	.blockTemplateArea .figureBox td.figureBox-figureArea {
		/* margin:0; */
		margin-bottom: 1rem;
		padding:0;
		text-align: center;
	}
	.blockTemplateArea .figureBlock p.caption{
		font-size:13px;
		margin:2px 0 0;
		padding:0 0 6px;
		text-align:left;
		color:#747474;
	}
	.blockTemplateArea table tbody {
		display: -webkit-box;
	}
	.blockTemplateArea table tr, 
	.blockTemplateArea table th,
	.blockTemplateArea table td {
		display: block;
	}
	.blockTemplateArea table.puregrid,
	.blockTemplateArea table.puregrid tbody,
	.blockTemplateArea table.puregrid tr{
	    width:100%;
		display:table;
	}
	.blockTemplateArea table.puregrid td {
		width:50%;
		display:flex;
	}
	.blockTemplateArea .headLv2-A{
		margin: 40px 0 20px;
	}
	.blockTemplateArea .headLv2-A h2 {
		font-size: 18px;
		line-height:22px;
		border-left:6px solid;
		padding-left:10px;
		font-weight: bold;
	}
	.blockTemplateArea .headLv3-A{
		margin: 40px 0 20px;
	}
	.blockTemplateArea .headLv3-A h3 {
		font-size: 16px;
		line-height:20px;
	}
}


/* カテゴリ名
	============================================================ */
@media screen and (min-width: 751px) {
	#subhead{
		font-size: 15px;
		line-height: 15px;
		display: block;
		overflow: hidden;
		margin: 20px 0 40px 0;
	}
}
@media screen and (max-width: 750px) {
	#article #subhead{
		display: block;
		margin: 8px 0;
		width: 100%;
		height: 12px;
	}
}

/* カードリンク
	============================================================ */
a.card-link {
	padding : 0.5rem;
	display : table;
	white-space : inherit;
	border-radius : 0;
}
a.card-link .columns {
	margin-right : -.75rem;
	margin-left : -.75rem;
	margin-top : -.75rem;
}
a.card-link .columns:last-chiled {
	margin-bottom : -.75rem;
}

a.card-link hr {
	margin : 1rem 0;
}

a.card-link .card-link-image {
	padding-right : 0!important;
}

a.card-link .card-link-content {
	text-align : left;
}
@media screen and (min-width: 751px) {
	a.card-link {
		margin : 1rem 0;
	}
	a.card-link .card-link-content .title {
		font-size : 1.4rem;
		font-weight : 400;
		margin-bottom : 0;
		color : #444;
	}
	a.card-link .card-link-content .desc {
		font-size : 1rem;
	}
	a.card-link .column {
		padding : 1.5rem;
	}
}
@media screen and (max-width: 750px) {
	a.card-link {
		margin : 1rem auto;
	}
	a.card-link .card-link-content .title {
		font-size : 1rem;
		font-weight : bold;
		margin-bottom : 0;
		color : #444;
	}
	a.card-link .card-link-content .desc {
		font-size : 0.8rem;
	}
	a.card-link .column {
		padding : 0.75rem;
	}
}


/* アコーディオン
	============================================================ */
.blockTemplateArea :is(.accordion, details) {
	margin: 2rem 0;
	padding: 1rem;
	border: solid 1px;
}
.blockTemplateArea details summary {
	font-weight: bold;
	font-size: 1rem;
}
.blockTemplateArea .accordion > p:first-child {
	position: relative;
	text-indent: 1rem;
}
.blockTemplateArea .accordion > p:first-child::first-line {
	padding-left: 1rem;
	font-weight: bold;
}
.blockTemplateArea .accordion > p:first-child::before {
    content: "";
    position: absolute;
    left: 0;
    transform: translateY(-50%);
    border: 5px solid transparent;
    border-left: 9px solid #333;
    transition: transform 0.3s ease-out;
}
.blockTemplateArea .accordion.open p::before {
	transform: rotate(90deg) translateY(0.2rem);
}
.blockTemplateArea .accordion {
  overflow: hidden;
  transition: height 1s ease;
}
.blockTemplateArea a.acc_title {
  color: #000;
  display: block;
}

@media screen and (min-width: 751px) {
	.blockTemplateArea .accordion > p:first-child::before {
	    top: .8rem;
	}
}
@media screen and (max-width: 750px) {
	.blockTemplateArea .accordion > p:first-child::before {
	    top: .6rem;
	}
}


.blockTemplateArea p.mb1em {
  margin-top: 1.5em;
}
.blockTemplateArea p.mb2em {
  margin-top: 3em;
}
.blockTemplateArea .mt-1em{ margin-top:1.5em; }
.blockTemplateArea .mt-2em{ margin-top:3em; }
.blockTemplateArea .mt-3em{ margin-top:4.5em; }
.blockTemplateArea .mt-4em{ margin-top:6em; }
.blockTemplateArea .mt-5em{ margin-top:7.5em; }
.blockTemplateArea .mt-6em{ margin-top:9em; }
.blockTemplateArea .mb-1em{ margin-bottom:1.5em; }
.blockTemplateArea .mb-2em{ margin-bottom:3em; }
.blockTemplateArea .mb-3em{ margin-bottom:4.5em; }
.blockTemplateArea .mb-4em{ margin-bottom:6em; }
.blockTemplateArea .mb-5em{ margin-bottom:7.5em; }
.blockTemplateArea .mb-6em{ margin-bottom:9em; }
.blockTemplateArea .pt-1em{ padding-top:1.5em; }
.blockTemplateArea .pt-2em{ padding-top:3em;  }
.blockTemplateArea .pb-1em{ padding-bottom:1.5em; }
.blockTemplateArea .pb-2em{ padding-bottom:3em;  }

/* リンクのコントラスト比を3:1以上にし、マウスフォーカス時に下線を表示する */
.blockTemplateArea a {
  color: #63B2ED;
}
.blockTemplateArea a:hover {
  color: inherit;
  text-decoration-line: underline;
}




#howto_register {
	width: 100%;
}
#howto_register h3,#howto_register h4,#howto_register p, #howto_register dt,#howto_register dd {
	margin-bottom: 16px;
}
#howto_register div.headLv2-A {
	margin: 40px 0 40px;
}

#howto_register div.headLv2-A h2 {
    line-height: 26px;
    border-left: 8px solid;
    padding-left: 12px;
}
#howto_register h3 {
	font-weight:  bold;
	margin-bottom: 24px;
}
#howto_register div.register_download {
    padding: 16px;
    width: 100%;
	border: 1px solid #C3C4CC;
	margin-bottom: 16px;
}
#howto_register div.howto_register_step1,#howto_register div.howto_register_step2 {
    margin-bottom: 40px;
}
#howto_register div.register_download h4 {
    font-weight: bold;
}
#howto_register div.register_download ul {
	display: flex;
	align-items: flex-end;
}
#howto_register div.register_download ul li {
	 font-size: 14px;
	text-align: center;
}
#howto_register div.register_download ul li.img_qr  {
	    width: 100px;
		margin-right: 16px;
}
#howto_register div.register_download ul li.img_qr img {
	    width: 100px;
		padding-bottom: 6px;
}
#howto_register div.register_download ul li.btn_ios  {
	    width: 120px;
	margin-right: 16px;

}
#howto_register div.register_download ul li.btn_ios img {
	    width: 120px;
		padding-bottom: 6px;
}
#howto_register div.register_download ul li.btn_android  {
	    width: 140px;
}
#howto_register div.register_download ul li.btn_android img {
	    width: 140px;
}
#howto_register div.register_link {
    padding: 16px;
    width: 100%;
	background: #F2F5F7;
	margin-bottom: 16px;
}
#howto_register p.register_link  {
	margin-bottom: 0px;
}
#howto_register p.register_link a {
	color: #0072CD;
	font-weight: bold;
	padding-right: 24px;
     background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="x,y"><path fill="%230072CD" d="M8.53745 16.169L8.16545 15.835C7.96045 15.649 7.94345 15.334 8.12845 15.128L11.5425 11.337C11.7135 11.147 11.7135 10.857 11.5425 10.667L8.12845 6.87598C7.94345 6.66998 7.96045 6.35498 8.16545 6.16898L8.53745 5.83498C8.74245 5.64898 9.05845 5.66598 9.24345 5.87198L13.5595 10.668C13.7305 10.857 13.7305 11.147 13.5595 11.336L9.24345 16.132C9.05845 16.338 8.74245 16.355 8.53745 16.169" /></svg>');
  background-repeat: no-repeat;
  background-position: right 0px center;
  background-size: 20px /*横幅の値*/ 20px /*高さの値*/ ;
}
#howto_register div.register_card {
    padding: 16px;
    width: 100%;
	border: 1px solid #C3C4CC;
	margin-bottom: 16px;
}
#howto_register div.register_card h4 {
    font-weight: bold;
}
#howto_register div.register_card dl {
    display: flex;
}
#howto_register div.register_card dl dt {
    width: 234px;
	margin-right: 16px;
}
#howto_register div.register_card dl dd span {
    font-weight: bold;
}
#howto_register div.register_card dl dd {
    width: 100%;
}
#howto_register div.howto_register_step3 dl {
    display: flex;
}
#howto_register div.howto_register_step3 dl dt {
    width: 234px;
	margin-right: 16px;
}
#howto_register div.howto_register_step3 dl dd {
    width: 100%;
}
#howto_register dl.howto_register_caution dt,#howto_register dl.howto_register_caution dd {
	margin-bottom: 0px;
	font-size: 14px;
}

#howto_register p.register_download_sp {
  margin-bottom: 0px;
  padding: 12px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 6px;
  background: #181819;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="x,y"><path fill="%23fff" d="M13.154 3.16442C13.3716 3.16682 13.5484 3.34362 13.55 3.56122L13.5972 8.31002C13.5988 8.53082 13.4212 8.71082 13.2004 8.71242L12.8004 8.71642C12.5788 8.71802 12.3988 8.54122 12.3972 8.31962L12.3636 5.19802L7.68279 9.87162C7.52679 10.0276 7.27319 10.0276 7.11719 9.87162L6.83399 9.58842C6.67799 9.43242 6.67799 9.17882 6.83399 9.02282L11.5156 4.34762L8.37799 4.31002C8.15799 4.30762 7.98039 4.12682 7.98199 3.90602L7.98599 3.50602C7.98839 3.28442 8.16919 3.10762 8.38999 3.11002L13.154 3.16442ZM11.6 12.7058V10.7058C11.6 10.485 11.4208 10.3058 11.2 10.3058H10.8C10.5792 10.3058 10.4 10.485 10.4 10.7058V12.3058C10.4 12.7474 10.0424 13.1058 9.59999 13.1058H4.39999C3.95759 13.1058 3.59999 12.7474 3.59999 12.3058V7.90578C3.59999 7.46338 3.95759 7.10578 4.39999 7.10578H5.99999C6.22079 7.10578 6.39999 6.92658 6.39999 6.70578V6.30578C6.39999 6.08498 6.22079 5.90578 5.99999 5.90578H3.99999C3.11679 5.90578 2.39999 6.62258 2.39999 7.50578V12.7058C2.39999 13.589 3.11679 14.3058 3.99999 14.3058H9.99999C10.8832 14.3058 11.6 13.589 11.6 12.7058Z" /></svg>');
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 20px /*横幅の値*/ 20px /*高さの値*/ ;
  padding-right: 36px;
  padding-left: 16px;
  color: #FFF;
}
#howto_register p.register_download_sp a {
	color: #ffffff;
}
/* SP用
-------------------------------------------- */
@media screen and (max-width: 750px) {
	#howto_register ul.register_download_pc {
    display: none !important;
	}
}

/* PC用
-------------------------------------------- */

@media screen and (min-width: 751px) {
  #howto_register p.register_download_sp {
    display: none;
  }
	
}
/* あきこちゃん用 */
.akiko #wrapper #wrapper2 #return,.akiko #wrapper #wrapper2 #news {
  display: none !important;
}