@charset "utf-8";


/* -------------------------------------------------- */
/* メインビジュアル（PC・スマホ共通）
/* -------------------------------------------------- */

.lesson .mainVisual{
	width:100%;
	background-image:url(../../images/tokusyu/lesson/vol002/mainvisual_bg.jpg);
	background-position:center;
	background-repeat: no-repeat;
	background-color:#6cc0fe;
	background-size:cover;
}
.lesson .mainVisual__inner{
	height:380px;
	margin:0 auto;
  overflow:hidden;
  position:relative;
  width:1000px;
}
.lesson .mainVisual__inner h2{
  right:5%;
  position:absolute;
  top:calc(50% - 130px);
  width:50%;
}
.lesson .mainVisual__inner h2 img,
.lesson .mainVisual__inner p img{
  width:100%;
}
.lesson .mainVisual__inner p{
  left:5%;
  position:absolute;
  width:30%;
  top:20%;
}
.lesson .mainVisual__inner i{
  bottom:5px;
  color:#FFF;
  font-size:10px;
  position:absolute;
  right:5%;
}

/* ******* レスポンシブ START ******* */
@media screen and (max-width:999px){
  .lesson .mainVisual__inner{
    width:100%;
  }
}
@media screen and (max-width:899px){
  .lesson .mainVisual__inner h2{
    right:30px;
    top:calc(50% - 100px);
    width:60%;
  }
  .lesson .mainVisual__inner p{
    bottom:-10%;
    left:10px;
    width:30%;
    top:inherit;
  }
}
@media screen and (max-width:729px){
  .lesson .mainVisual__inner{
    height:300px;
  }
}
@media screen and (max-width:639px){
  .lesson .mainVisual__inner{
    height:250px;
  }
  .lesson .mainVisual__inner h2{
    right:20px;
    top:calc(50% - 80px);
    width:60%;
  }
  .lesson .mainVisual__inner p{
    bottom:inherit;
    left:10px;
    width:30%;
    top:20%;
  }
  .lesson .mainVisual__inner i{
    font-size:8px !important;
  }
}
@media screen and (max-width:519px){
  .lesson .mainVisual__inner{
    height:230px;
  }
}
@media screen and (max-width:479px){
  .lesson .mainVisual__inner{
    height:200px;
  }
  .lesson .mainVisual__inner h2{
    top:calc(50% - 60px);
  }
}
@media screen and (max-width:399px){
  .lesson .mainVisual__inner{
    height:150px;
  }
  .lesson .mainVisual__inner h2{
    top:calc(50% - 50px);
  }
}
/* ******* レスポンシブ END ******* */

/* --------------------------------------------------------------
ページ(PC)
-------------------------------------------------------------- */

table.brwsr1 th {
padding: 5px;
vertical-align: middle;
text-align: left;
color: #fff;
}

table.brwsr1 td {
padding: 12px;
vertical-align: middle;
text-align: left;
font-size: 18px;
border-bottom:1px solid #fff;
border-left:1px solid #fff;
text-align: center;
font-weight:bold;
}
table.brwsr1 th.r1{
  background-color:#07C;
	color:#FFF;
	font-weight:normal;
	width:30%;
}
table.brwsr1 th.r1.odd{
	background-color:#dff0ff;
  color:#000;
}
table.brwsr1 th.r1.even{
	background-color:#f0f8ff;
  color:#000;
}
table.brwsr1 th.r2{
border-left: #fff 1px solid;
background: #FAA300;
font-size:25px;
position: relative;
}
table.brwsr1 th.r2:before{
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
 	margin-left: -10px;
	border: 10px solid transparent;
	border-top: 10px solid #FAA300;
}

table.brwsr1 th.r2,
table.brwsr1 th.r3,
table.brwsr1 th.r4 {
text-align: center;
}
table.brwsr1 td.r2.odd{
	background-color:#ffd688;
}
table.brwsr1 td.r2.even{
	background-color:#ffeecf;
}

table.brwsr1 th.r3{
border-left: #fff 1px solid;
background: #F63E02;
font-size:25px;
position: relative;
}
table.brwsr1 th.r3:before{
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
 	margin-left: -10px;
	border: 10px solid transparent;
	border-top: 10px solid #F63E02;
}
table.brwsr1 td.r3.odd{
	background-color:#ffa88c;
}
table.brwsr1 td.r3.even{
	background-color:#ffdbd0;
}

@media screen and (min-width:640px){

/* -------------------------------------------------- */
/* スマホ用エレメントを非表示にするクラス
/* -------------------------------------------------- */

.pc_none{
	display:none;
}

/* -------------------------------------------------- */
/* 全体の設定
/* -------------------------------------------------- */
.lesson{
	width:100%;
	color:#333;
}


  
.lesson .mainRead{
	width:100%;
	background-color:#0883ec;
}

.lesson .mainRead__inner{
	width:1000px;
	box-sizing: border-box;
	margin:0 auto;
	padding:15px 10px;
	text-align:center;
	font-weight: bold;
	font-size: 18px;
	line-height: 1.5;
	background-color:#0883ec;
	color:#fff;
}

/* ******* レスポンシブ START ******* */
@media screen and (max-width:999px){
  .lesson .mainRead__inner{
    width:100%;
  }
}
@media screen and (max-width:829px){
  .lesson .mainRead__inner{
    font-size:16px;
  }
}
@media screen and (max-width:739px){
  .lesson .mainRead__inner{
    font-size:14px;
  }
}

/* ******* レスポンシブ END ******* */

/* -------------------------------------------------- */
/* コンテンツ部分
/* -------------------------------------------------- */
.lesson .top__read{
	width:1000px;
	margin: 20px auto 0;
	font-size:18px;
	text-align: left;

}

.lesson .mainContent{
	width:1000px;
	margin:40px auto 0;
	background-color:#fff;
	box-sizing: border-box;
	text-align:left;
	font-size:16px;
	line-height:1.8;
}

.mainContent__innerCont{
	padding:0 20px;
	box-sizing: border-box;
}

.mainContent__read{
	margin-bottom:20px;
}

.mainContent__ttl{
	position: relative;
	padding: 0.25em 0 0;
	margin-bottom:15px;
}
.mainContent__ttl:after {
	content: "";
	display: block;
	height: 4px;
	background: -moz-linear-gradient(to right, rgb(27, 132, 222), transparent);
	background: -webkit-linear-gradient(to right, rgb(27, 132, 222), transparent);
	background: linear-gradient(to right, rgb(27, 132, 222), transparent);
}

.mainContent__sttl_2 {
  position: relative;
  padding: 3px 15px;
}
.mainContent__sttl_2::after  {
  position: absolute;
	top: 0.5em;
  left: 0;
  content: '';
  width: 6px;
  height: -webkit-calc(100% - 1em);
  height: calc(100% - 1em);
  background-color: #3498db;
  border-radius: 4px;
}

.mainContent__sttl{
	font-size:20px;
	line-height:1.5;
	margin-bottom:10px;
	border-bottom:1px solid #333;
}
.mainContent__wap{
	padding-bottom:40px;
}
.lesson .mainContent img{
	width:100%;
}

.lesson .leftCont{
	float: left;
	margin-right:20px;
	position: relative;
}
.lesson .rightCont{
	float: right;
	position: relative;
}
/* -------------------------------------------------- */
/* テーブルデザイン
/* -------------------------------------------------- */
table.brwsr1 {
width:100%;
margin: 0 auto;
border-collapse:collapse;
margin-bottom:40px;
}
table.brwsr1 th.r1{
	width:25%;
}
table.brwsr1 td{
font-size: 18px;
}
table.brwsr1 th.r1{
	padding-left:20px;
}

/* -------------------------------------------------- */
/* h3のデザイン
/* -------------------------------------------------- */

.mainContent__sttl_2{
  font-size:16px;
}
.mainContent__sttl_a{
	border-bottom:1px solid #ffd482;
	background-color: #ffeecf;
	vertical-align: bottom;
	line-height:1.3;
	padding:10px;
	border-radius: 5px;
	margin-bottom:10px;
}
.mainContent__sttl_a span{
	background-color:#FAA300;
	padding:5px 10px;
	border-radius: 3px;
	font-size:.6em;
	display: inline-block;
	color:#fff;
	margin-right:5px;
	vertical-align: top;
}
.mainContent__sttl_b{
	border-bottom:1px solid #ffa88c;
	background-color: #ffdbd0;
	vertical-align: bottom;
	line-height:1.3;
	padding:10px;
	border-radius: 5px;
	margin-bottom:10px;
}
.mainContent__sttl_b span{
	background-color:#F63E02;
	padding:5px 10px;
	border-radius: 3px;
	font-size:.6em;
	display: inline-block;
	color:#fff;
	margin-right:5px;
	vertical-align: top;
}
/* -------------------------------------------------- */
/* 吹き出しなどのスタイル部分
/* -------------------------------------------------- */

.mainContent__box01{
	margin-bottom:30px;
}
.mainContent__box01 .box-title {
    font-size: 1.2em;
    background: #fbc242;
    padding: 4px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}

.mainContent__box01 p {
    padding: 15px 20px;
		box-sizing: border-box;
		border:1px solid #fbc242;
    margin: 0;
}

.mainContent__box02 {
    position: relative;
    margin: 30px 0;
    padding: 0.8em 1em;
    border: solid 2px #ece737;
    border-radius: 8px;
}
.mainContent__box02 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 20px;
    padding: 0 15px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #444;
    font-weight: bold;
}
.mainContent__box02 p {
    margin: 0;
    padding: 0;
}

.mainContent__box03 {
	margin: 2em auto;
	padding: 10px;
	border-style: solid;
	border-width: 5px 0 0 0;
	border-color: #c0d8a0; /* 枠の色 */
	background-color: #fbffe9; /* 背景色 */
	color: #666; /* テキスト色 */
  font-size:20px;
}
.mainContent__box03 .box-title {
	padding:0 10px;
	margin:0 auto;
	text-align: center;
	color: #333; /* タイトル色 */
	font-size: 1.1em;
	font-weight: bold;
	border-style: none none double;
	border-color: #c0d8a0; /*タイトル下線 */
	border-width: 3px;
}
.mainContent__box03 p{
	margin:10px 10px 0;
}
.mainContent__box03 ul{
	margin:20px 0 0 200px;

}
.mainContent__box03 li{
	margin-bottom:10px;
	text-indent: -1em;
  padding-left: 1em;
	line-height: 1.5;
}
.mainContent__box03 li:before{
	content:"・";
}

.balloon{
	margin:30px 0 50px;
  position: relative;
  padding: 20px 28px;
  border:2px solid #666;
  box-sizing: border-box;
  border-radius: 5px;
}

/* beforeで枠線の三角を表現 */
.balloon::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 48.5%;
  top: -15px;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #666;
  border-left: 15px solid transparent;
}

/* beforeで本体の三角を表現 */
.balloon::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 48.5%;
  top: -12px;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #fff;
  border-left: 15px solid transparent;
}

.balloon_check{
  font-size:25px;
  line-height:1.3;
  border-bottom:3px double #bbb;
  text-align: center;
  margin-bottom:20px;
}
.balloon_read{
  font-size:15px;
  margin-top:20px;
}
.ball__read{margin-bottom:20px;font-size:17px;}
.read_small{
  font-size:14px;
  padding-left:1em;
text-indent:-1em;
}
/* -------------------------------------------------- */
/* バナー
/* -------------------------------------------------- */

.linkList li a{
	     display:block;
	     color: #FFF;
			 padding:10px;
			 line-height:1.5;
			 width:80%;
			 margin:0 auto;
			 font-size:26px;
			 font-weight:bold;
	     text-decoration: none;
	     text-align: center;
			 background-color: #0080cb;
	     border-bottom: solid 6px #0d69b9;
	     border-radius: 5px; /*角丸*/
			 position: relative;

	}
.linkList li a:hover{
	     background-color: #2790ec;/*ボタン色*/
	     border-bottom: solid 6px #1270c3; /*下線色*/
	}

.linkList li a:before {        /*白い丸 */
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right :19px;
	width: 20px;
	height: 20px;
	margin-top: -8px;
	border-radius: 50%;        /* CSS3草案 */
  -webkit-border-radius: 50%;    /* Safari,Google Chrome用 */
  -moz-border-radius: 50%;   /* Firefox用 */
	background: #fff;
}
.linkList li a:after {        /*「after要素」で三角 */
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 19px;
	width: 0;
	height: 0;
	margin-top: -3px;
	border: 6px solid transparent;
	border-left: 6px solid #1875c7;
}
.linkList li a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */
	border-left: 6px solid #2790ec;
}

.linkList__read{
  font-size:.60em;
	display: block;
	line-height:1.6;
}


/* -------------------------------------------------- */
/* 汎用スタイル部分
/* -------------------------------------------------- */


.lesson .contentBottomMargin{margin-bottom:30px;}
.lesson .wid250{width:250px;}
.lesson .wid260{width:260px;}
.lesson .wid280{width:280px;}
.lesson .wid300{width:300px;}
.lesson .wid340{width:340px;}
.lesson .wid360{width:360px;}
.lesson .wid380{width:380px;}
.lesson .wid400{width:400px;}
.lesson .wid420{width:420px;}
.lesson .wid440{width:440px;}
.lesson .wid460{width:460px;}
.lesson .wid470{width:470px;}
.lesson .wid480{width:480px;}
.lesson .wid500{width:500px;}
.lesson .wid520{width:520px;}
.lesson .wid540{width:540px;}
.lesson .wid560{width:560px;}
.lesson .wid580{width:580px;}
.lesson .wid600{width:600px;}
.lesson .wid620{width:620px;}
.lesson .wid640{width:640px;}
.lesson .wid660{width:660px;}
.lesson .wid680{width:680px;}
.lesson .bold{font-weight:bold;}
.lesson .red{color:#c00;}
.lesson .boldRed{font-weight:bold;color:#c00;}
.mb10{margin-bottom:10px;}
.mb50{margin-bottom:50px;}

.annotation{
  padding-top:30px;
  border-top:1px dotted #aaa;
}
.annotation a{
  color:#4B82E8;
  text-decoration: underline;
  line-height:1.5;
}
.annotation a:hover{
  color:#42a3f5;
  text-decoration: none;
}



/* -------------------------------------------------- */
/* POINT部分
/* -------------------------------------------------- */

.point__ttl{
	box-sizing: border-box;
  position: absolute;
	top:0;
	left:0;
  width:100%;
  padding:10px;
  vertical-align: top;
}
.numTtl{
  border-radius: 50%;
  box-sizing:border-box;
  font-size: 1.2em;
  width:1.5em;
  height:1.5em;
  display: inline-block;
  background-color:#1b84de;
  color:#fff;
  margin-right:.3em;
  text-align: center;
  line-height: 1.5;
}
.numTtl.c1{
	font-size:33px;
	background-color:#FAA300;
}
.numTtl.c2{
	font-size:33px;
	background-color:#f63e02;
  padding-top:2px;
}
.numTtl2{
  color:#3498db;
  margin-right:.3em;
  font-size:1.2em;
}

.comment{
  background-color:#FFF;
  border:2px solid #CCC;
  border-radius:3px;
  bottom:58%;
  box-sizing:border-box;
  padding:7px;
  position:absolute;
  right:5px;
  width:47%;
}
.comment:after,
.comment:before{
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.comment:after{
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #FFFFFF;
	border-width: 15px;
	margin-left: -15px;
}
.comment:before{
	border-color: rgba(204, 204, 204, 0);
	border-top-color: #CCC;
	border-width: 18px;
	margin-left: -18px;
}
.comment h4{
  font-size:16px;
  line-height:1.3;
  margin-bottom:5px;
}
.comment p{
  font-size:14px;
  line-height:1.3;
}

.numTtl3{
  border-radius: 10px;
  font-size: 0.8em;
  height:1.5em;
  padding:0 .5em;
  display: inline-block;
  background-color:#1b84de;
  border: 1px solid #1b84de;
  color:#fff;
  margin-right:.3em;
  text-align: center;
  line-height: 1.5;
}

.mainContent .point{
	background-color:rgba(51, 51, 51, 0.8);
	color:#fff;
	box-sizing: border-box;
	position: absolute;
	bottom:0;
	left:0;
	width:100%;
	padding:8px 10px;
	font-size: 15px;
}
.mainContent .point2{
	background-color:rgba(51, 51, 51, 0.9);
	color:#fff;
	box-sizing: border-box;
	width:100%;
	padding:8px 10px;
	font-size: 15px;
  margin-bottom:40px;
}
.mainContent .point_2l{
  height:70px;
  padding-left:90px;
  text-indent:-85px;
}
.mainContent .point__sttl{
	background-color:#fff;
	color:#333;
	padding:2px 8px;
	margin-right:5px;
	border-radius: 3px;
	font-size: 14px;
	padding-left:30px;
	background-image:url(../../images/tokusyu/lesson/common/point.png);
	background-size:20px;
	background-repeat: no-repeat;
	background-position: top 0 left 5px;
}

.mainContent .yokoku{
	background-color:#eee;
	text-align: center;
	font-size:18px;
	font-weight: bold;
	padding:15px 0;
}
.mainContent .yokoku__icon{
	background-color:#333;
	padding:3px 10px;
	color:#fff;
	margin-right:10px;
	border-radius: 3px;
}
.c-heading {
	  font-size: 60px;
    text-align: center;
    font-family: Oswald,-apple-system,BlinkMacSystemFont,Helvetica Neue,Segoe UI,Verdana,Hiragino Sans,Hiragino Kaku Gothic ProN,Yu Gothic Medium,"游ゴシック Medium",YuGothic,"游ゴシック体","メイリオ",meiryo,sans-serif;
    font-weight: 700;
    letter-spacing: .08em;
    margin-bottom: .5em;
    color: #189fc7;
}
.l-iron__image {
    position: relative;
    background-color: #000;
    width: 1000px;
    margin: auto;
}
.l-iron__image-link:nth-of-type(1) {
    width: 250px;
    height: 250px;
    top: 120px;
    left: 170px;
    margin: 0;
}
.l-iron__image-link:nth-of-type(2) {
    width: 220px;
    height: 220px;
    top: 490px;
    left: 170px;
    margin: 0;
}
.l-iron__image-link:nth-of-type(3) {
    width: 190px;
    height: 250px;
    top: 120px;
    left: 500px;
}

.l-iron__image-link:nth-of-type(4) {
    width: 190px;
    height: 250px;
    top: 120px;
    left: 700px;
}
.l-iron__image-link:nth-of-type(5) {
    width: 220px;
    height: 220px;
    top: 490px;
    left: 590px;
    margin: 0;
}
.l-iron__image-link {
    position: absolute;
    background-color: rgba(255,255,255,.1);
    opacity: 0;
}
.l-iron__image-link:hover {
    animation: flashOut .5s ease 0s 1 normal;
}
@keyframes flashOut{
	0%{opacity:1}
	100%{opacity:0}
}
.l-iron{
	margin-bottom:30px;
}

}

/* --------------------------------------------------------------
ページ(SP)
-------------------------------------------------------------- */

@media screen and (max-width:640px){


/* -------------------------------------------------- */
/* PC用エレメントを非表示にするクラス
/* -------------------------------------------------- */
.sp_none{
	display:none;
}
/* -------------------------------------------------- */
/* 全体の設定
/* -------------------------------------------------- */

.lesson{
	width:100%;

	box-sizing: border-box;
}
.lesson img{
	width:100%;
}

/* -------------------------------------------------- */
/* メインビジュアル
/* -------------------------------------------------- */
.mainRead{
	background-color:#1a84de;
}
.mainRead__inner{
	padding:5px 5%;
	box-sizing: border-box;
	font-size:12px;
  line-height:1.4;
  color:#fff;
  text-align:left;
}


/* -------------------------------------------------- */
/* コンテンツ部分
/* -------------------------------------------------- */

.lesson .mainContent{
	padding:20px 5% 0;
	bacKground-color:#fff;
	box-sizing: border-box;
	text-align:left;
	font-size:16px;
	line-height:1.8;
}
.rightCont,.leftCont{
	margin-bottom:20px;
  line-height:0;
}

.lesson .contentBottomMargin{margin-bottom:0;}
.lesson .leftCont,.lesson .rightCont{
	position: relative;
}
.mainContent .point{
	height:auto;
	bottom: 8px;
}
.mainContent{
  font-size:13px;
}
.mainContent__innerCont{
  font-size:13px;
}
.mainContent__read{
	font-size:13px;
  line-height:1.4;
  margin-bottom:15px;
}
.mainContent__ttl{
	position: relative;
	padding: 0.25em 0;
	margin-bottom:10px;
  font-size:18px;
}
.mainContent__ttl:after {
	content: "";
	display: block;
	height: 4px;
	background: -moz-linear-gradient(to right, rgb(27, 132, 222), transparent);
	background: -webkit-linear-gradient(to right, rgb(27, 132, 222), transparent);
	background: linear-gradient(to right, rgb(27, 132, 222), transparent);
}
.mainContent__sttl_a{
	border-bottom:1px solid #ffd482;
	background-color: #ffeecf;
	vertical-align: bottom;
	line-height:1.3;
	padding:10px;
	border-radius: 5px;
	margin-bottom:10px;
}
.mainContent__sttl_a span{
	background-color:#FAA300;
	padding:5px 10px;
	border-radius: 3px;
	font-size:.6em;
	display: inline-block;
	color:#fff;
	margin-right:5px;
	vertical-align: top;
}
.mainContent__sttl_b{
	border-bottom:1px solid #ffa88c;
	background-color: #ffdbd0;
	vertical-align: bottom;
	line-height:1.3;
	padding:10px;
	border-radius: 5px;
	margin-bottom:10px;
}
.mainContent__sttl_b span{
	background-color:#F63E02;
	padding:5px 10px;
	border-radius: 3px;
	font-size:.6em;
	display: inline-block;
	color:#fff;
	margin-right:5px;
	vertical-align: top;
}

/* -------------------------------------------------- */
/* テーブルデザイン
/* -------------------------------------------------- */
table.brwsr1 {
width:100%;
margin: 0 auto 20px;
border-collapse:collapse;

}
table.brwsr1 th.r1{
	width:35%;
}
table.brwsr1 th,
table.brwsr1 td{
	font-size:14px;
}
table.brwsr1 th.r2,
table.brwsr1 th.r3{
	font-size:15px;
}

/* -------------------------------------------------- */
/* コンテンツ部分
/* -------------------------------------------------- */

.mainContent__box03 {
	margin: 20px auto;
	padding: 5px;
	border-style: solid;
	border-width: 5px 0 0 0;
	border-color: #c0d8a0; /* 枠の色 */
	background-color: #fbffe9; /* 背景色 */
	color: #666; /* テキスト色 */
}
.mainContent__box03 .box-title {
	padding:0 5px;
	margin:0 auto;
	text-align: center;
	color: #333; /* タイトル色 */
	font-size: 1.1em;
	font-weight: bold;
	border-style: none none double;
	border-color: #c0d8a0; /*タイトル下線 */
	border-width: 3px;
}
.mainContent__box03 p{
	margin:5px 5px 0;
}
.mainContent__box03 ul{
	margin:10px 5px 0;
}
.mainContent__box03 li{
	margin-bottom:10px;
	text-indent: -1em;
  padding-left: 1em;
	line-height: 1.5;
	font-size:14px;
}
.mainContent__box03 li:before{
	content:"・";
}

.balloon{
	margin:20px 0 30px;
  position: relative;
  padding: 10px;
  border:1px solid #666;
	font-size:14px;
  border:2px solid #666;
}

/* beforeで枠線の三角を表現 */
.balloon::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 48.5%;
  top: -15px;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #666;
  border-left: 15px solid transparent;
}

/* beforeで本体の三角を表現 */
.balloon::after{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 48.5%;
  top: -12px;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #fff;
  border-left: 15px solid transparent;
}

.point__ttl,
.mainContent .point{
  font-size:14px;
}

.ball__read,.read_small{line-height:1.5;}
.ball__read{margin-bottom:20px;font-size:14px;}
.read_small{font-size:.8em;padding-left:1em;text-indent:-1em;}

/* -------------------------------------------------- */
/* POINT部分
/* -------------------------------------------------- */

.point__ttl{
	box-sizing: border-box;
  position: absolute;
	top:0;
	left:0;
  width:100%;
  padding:10px;
  vertical-align: top;
  line-height:1.5;
}
.numTtl{
  border-radius: 50%;
  font-size: 1.2em;
  width:1.5em;
  height:1.5em;
  display: inline-block;
  background-color:#1b84de;
  color:#fff;
  margin-right:.3em;
  text-align: center;
  line-height: 1.5;
}
.numTtl.c1{
	font-size:25px;
	background-color:#FAA300;
}
.numTtl.c2{
	font-size:25px;
	background-color:#f63e02;
}
.numTtl2{
  color:#3498db;
  margin-right:.3em;
  font-size:1.2em;
}
.numTtl3{
  border-radius: 10px;
  font-size: 0.8em;
  height:1.5em;
  padding:0 .5em;
  display: inline-block;
  background-color:#1b84de;
  border: 1px solid #1b84de;
  color:#fff;
  margin-right:.3em;
  text-align: center;
  line-height: 1.5;
}
.point__list li{
  padding-left:1em;
  text-indent:-1em;
  margin-bottom:10px;
}

.comment{
  background-color:#FFF;
  border:2px solid #CCC;
  border-radius:3px;
  bottom:58%;
  box-sizing:border-box;
  padding:7px;
  position:absolute;
  right:5px;
  width:47%;
}
.comment:after,
.comment:before{
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.comment:after{
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #FFFFFF;
	border-width: 15px;
	margin-left: -15px;
}
.comment:before{
	border-color: rgba(204, 204, 204, 0);
	border-top-color: #CCC;
	border-width: 18px;
	margin-left: -18px;
}
.comment h4{
  font-size:16px;
  line-height:1.3;
  margin-bottom:5px;
}
.comment p{
  font-size:14px;
  line-height:1.3;
}
  
.mainContent .point{
	background-color:rgba(51, 51, 51, 0.8);
	color:#fff;
	box-sizing: border-box;
	position: absolute;
	bottom:0;
	left:0;
	width:100%;
	padding:8px 10px;
	font-size: 13px;
  line-height:1.8;
}
.mainContent .point2{
	background-color:rgba(51, 51, 51, 0.9);
	color:#fff;
	box-sizing: border-box;
	width:100%;
	padding:8px 10px;
	font-size: 13px;
  margin-bottom:40px;
  line-height:1.8;
}
.mainContent .point__sttl{
	background-color:#fff;
	color:#333;
	padding:2px 8px;
	margin-right:5px;
	border-radius: 3px;
	font-size: 13px;
	padding-left:30px;
	background-image:url(../../images/tokusyu/lesson/common/point.png);
	background-size:20px;
	background-repeat: no-repeat;
	background-position: top 0 left 5px;
}
.point__list li{
  padding-left:1em;
  text-indent:-1em;
  margin-bottom:10px;
}
.point__list{
  margin-top:10px;
}
.lh0{
  line-height:0;
}
/* -------------------------------------------------- */
/* バナー部分
/* -------------------------------------------------- */
.linkList li a{
	     display:block;
	     color: #FFF;
			 padding:10px 25px 10px 10px;
			 line-height:1.5;
			 width:90%;
			 margin:0 auto 80px;
			 font-size:14px;

			 font-weight:bold;
	     text-decoration: none;
	     text-align: center;
			 background-color: #0080cb;
	     border-bottom: solid 6px #0d69b9;
	     border-radius: 5px; /*角丸*/
			 position: relative;

	}
.linkList li a:hover{
	     background-color: #2790ec;/*ボタン色*/
	     border-bottom: solid 6px #1270c3; /*下線色*/
	}

.linkList li a:before {        /*白い丸 */
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right :19px;
	width: 20px;
	height: 20px;
	margin-top: -8px;
	border-radius: 50%;        /* CSS3草案 */
  -webkit-border-radius: 50%;    /* Safari,Google Chrome用 */
  -moz-border-radius: 50%;   /* Firefox用 */
	background: #fff;
}
.linkList li a:after {        /*「after要素」で三角 */
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 19px;
	width: 0;
	height: 0;
	margin-top: -3px;
	border: 6px solid transparent;
	border-left: 6px solid #1875c7;
}
.linkList li a:hover:after {        /*「after要素」のマウスオーバー（カラーを合わせる） */
	border-left: 6px solid #2790ec;
}

.linkList__read{
  font-size:.60em;
	display: block;
	line-height:1.6;
}

.linkList__read{
  font-size:.7em;
	line-height:1.5;
}

.annotation{
  padding-top:30px;
  border-top:1px dotted #aaa;
}
.annotation a{
  color:#4B82E8;
  text-decoration: underline;
  line-height:1.5;
}
.annotation a:hover{
  color:#42a3f5;
  text-decoration: none;
}
.annotation h4,
.annotation p{
  line-height:1.5;
}

.lesson .bold{font-weight:bold;}
.lesson .red{color:#c00;}
.lesson .boldRed{font-weight:bold;color:#c00;}

.c-heading {
    text-align: center;
    font-family: Oswald,-apple-system,BlinkMacSystemFont,Helvetica Neue,Segoe UI,Verdana,Hiragino Sans,Hiragino Kaku Gothic ProN,Yu Gothic Medium,"游ゴシック Medium",YuGothic,"游ゴシック体","メイリオ",meiryo,sans-serif;
    font-size: 9.6vw;
    font-weight: 700;
    letter-spacing: .08em;
    margin-bottom: .5em;
    color: #189fc7;
}

.l-iron__image {
    position: relative;
    background-color: #fff;
    width: 100%;
}
.l-iron__image-link {
    position: absolute;
    display: inline-block;
}

.l-iron__image-link:nth-of-type(1) {
    width: 66.66vw;
    height: 53.33vw;
    top: 48vw;
    left: 0;
    right: 0;
    margin: auto;
}
.l-iron__image-link:nth-of-type(2) {
    width: 66.66vw;
    height: 53.33vw;
    top: 120vw;
    left: 0;
    right: 0;
    margin: auto;
}
.l-iron__image-link:nth-of-type(3) {
    width: 40vw;
    height: 53.33vw;
    top: 218.66vw;
    left: 8vw;
}
.l-iron__image-link:nth-of-type(4) {
    width: 40vw;
    height: 53.33vw;
    top: 218.66vw;
    right: 8vw;
}
.l-iron__image-link:nth-of-type(5) {
    width: 66.66vw;
    height: 53.33vw;
    top: 290.66vw;
    left: 0;
    right: 0;
    margin: auto;
}


}