.contents-wrap{
	margin:18px auto;
	max-width: 1200px;
	background: url(/gnote/special/images/9784758123341-1398_ttl.png) no-repeat top center;
	background-size:  contain;
	padding: 45px 0 0;
}

.contents-wrap p{
	font-size:16px;
	line-height: 1.9;
}

.intro-box{
	margin: 20% 10px 3em;
	border-left:8px solid #ACD185;
	border-right:8px solid #ACD185;
	padding:0 12px;
}

.intro-box h1{
	font-size: 120%;
	font-weight: 700;
	margin-bottom: 8px;
}

p.zero{
	text-indent: 0;
}

h2.head2{
	border:#9e9e9e solid 5px;
	border-radius: 15px;
	background:#FFFCE1;
    padding: 32px 12px 0px;
	font-weight: 700;
	position: relative;
	font-size: 180%;
}

h2.head2:before{
	content:"第８回";
	background:#00A4DA;
	color:#FFF001;
	font-size: 80%;
	font-weight: 700;
	padding:5px 10px;
	border-radius: 10px;
	top:-20px;
	position: absolute;
}

h2.head2 p{
	text-align: right;
	font-size: 65%;
	font-weight: 700;
	margin: 0;
}

h3.head3{
	font-size: 140%;
	font-weight: 700;
	margin-bottom:1.2em;
}

.balloon-box{
	display: flex;
	flex-wrap: nowrap;
	margin-top:1.5em;
}

.balloon-box p{
	text-indent: 0;
	font-family: "Times New Roman",Times,"ヒラギノ明朝 Pro","Hiragino Mincho Pro","游明朝",YuMincho,"HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",serif;
}

.balloon-box i{
	font-weight: 700;
}

.icon-box-s, .icon-box-i{
	display: block;
	background: url(/gnote/special/images/9784758123341-1398_ichikawa-i.png) no-repeat;
	background-size: 50px auto;
	width:70px;
	height:50px;
	margin: 0 15px 0 0;
}

.icon-box-s{
	background: url(/gnote/special/images/9784758123341-1398_sibata-i.png) no-repeat;
	background-size: 50px auto;
}

.balloon-s, .balloon-i{
	border-left:1px solid #DD488C;
	position: relative;
	width:100%;
	padding: 0 0 0 10px;
}

.balloon-i{
	border-left:1px solid #007DB6;
	}

p.blockquote{
	text-decoration: italic;

}

.balloon-s:before, .balloon-i:before {
	content: "";
	position: absolute;
    top: 7px;
    left: -11px;
    margin-top: -10px;
    border: 12px solid transparent;
    border-right: 12px solid #FFF;
	transform: rotate(135deg);
	z-index: 2;
}	
.balloon-s:after, .balloon-i:after {
	content: "";
	position: absolute;
	top: 7px;
    left: -13px;
    margin-top: -12px;
    border: 13px solid transparent;
    border-right: 13px solid #DD488C;
	transform: rotate(135deg);
	z-index: 1;
}
.balloon-i:after {
	border-right: 13px solid #007DB6;
	}

p.shibata-remark:before{
	content:"（柴田）";
	color:#DD488C;
	font-family: sans-serif;
}

p.ichikawa-remark:before{
	content:"（市川）";
	color:#007DB6;
	font-family: sans-serif;
}

figure{
	margin:3em auto !important;
	max-width:50%;
}

.knowledge-box{
	border:#04A2CE solid 1px;
	border-radius: 15px;
	padding: 10px 40px;
	margin:5em 0 3em;
	position: relative;
	counter-reset: number;
}

.knowledge-box:before{
	content:"";
	display: block;
	background: url(/gnote/special/images/9784758123341-1398_knowledge-ttl.png) no-repeat;
	background-size: 250px auto;
	width:250px;
	height:35px;
	top:-17px;
	left:15px;
	position: absolute;
}

h3.knowledge-head{
	color:#243881;
	font-size: 140%;
	font-weight: 700;
	line-height: 1.4;
	text-indent: -1.7em;
	margin-left: 1.6em;
}

h3.knowledge-head:before{
	counter-increment: number;
  	content: counter(number);
	margin-right: 8px;
	background:#243881;
	width: 25px;
	height: 25px;
	text-align: end;
	line-height: 25px;
	display: inline-block;
	color:#fff;
	padding-right: 6px;
}

h4.knowledge-h4{
	font-size: 120%;
	font-weight: 700;
	margin-top:1.4em;
	line-height: 1.4;
	text-indent: -1.4em;
  	margin-left: 1.6em;
}

ul.knowledge-list{
	list-style: none;
	counter-reset: reference 0;
	font-size: 110%;
	line-height: 1.7;
	text-indent: -1.6em;
}
ul.knowledge-list li:before{
	counter-increment: reference;
    content: counter(reference)'）';
}

strong{
	font-family: sans-serif;
}

.summary-box{
	border:#00B8E0 solid 5px;
	border-radius: 15px;
	padding:20px 20px 5px 0;
	position: relative;
	margin:6em 0 4em;
	counter-reset: number;
}

.summary-box:before{
	content:"";
	position: absolute;
	background: url(/gnote/special/images/9784758123341-1398_summary-ttl.png) no-repeat;
    background-size: 370px auto;
    width: 370px;
    height: 60px;
    top: -28px;
	left:20px;
	}
ul.summary-list{
	list-style: none;
	padding-left: 35px;
}

ul.summary-list li{
	font-weight: 700;
	font-size: 130%;
	line-height: 1.6;
	text-indent: -1.7em;
  margin-left: 1.6em;
	}

ul.summary-list li:before{
	counter-increment: number;
	content: counter(number);
	margin-right: 8px;
	background:#007FBA;
	width: 23px;
	height: 23px;
	text-align: end;
	line-height: 23px;
	color:#fff;
	display: inline-block;
	padding-right: 6px;
}

.mb3{
	margin-bottom: 3em;
}

.mb4{
	margin-bottom: 4em;
}

.mt1{
	margin-top:1em;
}

.mt1-4{
	margin-top:1.4em;
}

.mt1-6{
	margin-top:1.6em;
}

.mt1-8{
	margin-top:1.8em;
}

.mt2{
	margin-top:2em;
}

.mt3{
	margin-top: 3em;
}

.mt4{
	margin-top:4em;
}

.mt5{
	margin-top:5em;
}

@media screen and (max-width: 640px){
.summary-box:before{
	background-size: 311px auto;
	width: 370px;
	height: 60px;
	top: -23px;
	left: 10px;
}
ul.summary-list {
    padding-left: 20px;
}
.contents-wrap p{
	font-size: 14px
	}
h2.head2 {
    padding: 24px 12px 0px;
    font-size: 140%;
  }
h3.head3 {
    font-size: 110%;
}
.knowledge-box {
    padding: 10px 20px;
}
h3.knowledge-head{
	font-size: 120%;
}
h3.knowledge-head:before {
    width: 22px;
    height: 22px;
    line-height: 22px;
    }
h4.knowledge-h4 {
    font-size: 100%;
  }
ul.knowledge-list {
    font-size: 12px;
  }
ul.summary-list li {
    font-size: 120%;
  }
ul.summary-list li:before {
    width: 22px;
    height: 22px;
    line-height: 22px;
}
figure{
	max-width:100%;
}
}

@media screen and (max-width: 380px){
.summary-box:before{
	background-size: 100% auto;
	width: 100%;
	height: 60px;
	left: 10px;
}
}

/*ツールチップ*/
#contents .main h5{font-size:medium;margin-top:1em;}
#contents .main p.point{text-indent:-1em;margin-left:3em;}
span.tips{text-decoration:underline;color: #428bca;cursor:pointer;}
span.tips .glyphicon{text-indent:0;}
.popover {
max-width: 600px; /* この数字を変える */
z-index: 2;
}