/* page_single_design.css */


/* ●●●　defaultstyle h1h6　●●● */

main article.default section h2 {
	font-family: "ZenMaruGothic";
	font-weight:800;
	display:block;
	overflow:hidden;
	color:#4477cc;
	font-size:28px;
	width:auto;
	padding:10px 10px 10px 10px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #88ccff;
	border-bottom:solid 1px #66bbff;
	/* background-image: linear-gradient(0deg, rgba(15, 125, 255, 0.1), rgba(15, 125, 255, 0.02) 90%);*/
	background: rgba(0, 119, 255, 0.1);/* #0077ff */
}

main article.default section h3 {
	font-family: 'ZenMaruGothic';
	font-weight:800;
	display:block;
	overflow:hidden;
	color:#117777;
	font-size:25px;
	width:auto;
	padding:7px 10px 7px 10px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #82c8c8;
	border-bottom:solid 1px #82c8c8;
	background: rgba(210, 240, 240, 1);/* #bbf3f3 */
}

main article.default section h4 {
	font-family: 'ZenMaruGothic';
	font-weight:700;
	display:block;
	overflow:hidden;
	color:#555555;
	font-size:22px;
	width:auto;
	padding:5px 7px 5px 7px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #999999;
	background: rgba(238, 238, 238, 1);
}

main article.default section h5 {
	font-family: 'ZenMaruGothic';
	font-weight:700;
	display:block;
	overflow:hidden;
	color:#4477cc;
	font-size:19px;
	width:auto;
	padding:5px 0px 5px 0px;
	margin:0px 0px 20px 0px;
	border-bottom:solid 5px #88ccff;
}

main article.default section h6 {
	font-family: 'ZenMaruGothic';
	font-weight:700;
	display:block;
	overflow:hidden;
	color:#117777;
	font-size:16px;
	width:auto;
	padding:5px 0px 5px 0px;
	margin:0px 0px 20px 0px;
	border-bottom:solid 3px #82c8c8;
}

main article.default section p {
	color:#555555;
	font-size:16px;
	width:auto;
	margin:0px 0px 10px 0px;
}

main article.default section p em {
	font-style:normal;
	color:#ff66bb;
	background-color:#ffff77;
	padding:0px 3px 2px 3px;
}
main article.default section p strong {
	font-weight:800;
	color:#0f7dff;
	text-decoration: #ff0000 double underline;
	padding:0px 3px 2px 3px;
}

main article.default section dl {
	width:auto;
	display:block;
	overflow:hidden;
	margin:0px 0px 20px 0px;
}

main article.default section dl dt {
	color:#555555;
	font-size:16px;
	width:auto;
	margin:0px 0px 4px 0px;
	font-weight:800;
}

main article.default section dl dd {
	padding:0px 0px 0px 12px;
	color:#555555;
	font-size:16px;
	width:auto;
	margin:0px 0px 0px 0px;
}
/* ●●●　teachstyle　●●● */

main article section.teachstyle {
	display:block;
	width:auto;
	height:auto;
	padding:0px;
}

main article section.teachstyle img{display:block;}
main article section.teachstyle img.i90per {width:90%; margin:0 auto 0 auto;}
main article section.teachstyle img.i80per {width:80%; margin:0 auto 0 auto;}

main article section.teachstyle h2.sir {
	font-family: 'ZenMaruGothic';
	font-weight:800;
	display:block;
	overflow:hidden;
	color:#006677;
	font-size:28px;
	width:auto;
	padding:10px 10px 10px 10px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #33aabb;
	border-bottom:solid 1px #33aabb;
	background: rgba(153, 221, 238, 0.6);/* #55bbcc */
}

main article section.teachstyle h3.sir {
	font-family: 'ZenMaruGothic';
	font-weight:700;
	display:block;
	overflow:hidden;
	color:#006677;
	font-size:25px;
	width:auto;
	padding:7px 10px 7px 10px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #33aabb;
	border-bottom:solid 1px #88dddd;
	background: rgba(85, 187, 204, 0.4);/* #55bbcc */
}

main article section.teachstyle h4.sir {
	font-family: 'ZenMaruGothic';
	font-weight:500;
	display:block;
	overflow:hidden;
	color:#006677;
	font-size:22px;
	width:auto;
	padding:5px 7px 5px 7px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #33aabb;
	border-bottom:solid 1px #88dddd;
	background: rgba(238, 238, 238, 1);
	background: rgba(85, 187, 204, 0.2);/* #55bbcc */
}

main article section.teachstyle h5.sir {
	font-weight:500;
	display:block;
	overflow:hidden;
	color:#006677;
	font-size:19px;
	width:auto;
	padding:5px 0px 5px 0px;
	margin:0px 0px 20px 0px;
	border-bottom:solid 5px #33aabb;
}

main article section.teachstyle h6.sir {
	font-weight:500;
	display:block;
	overflow:hidden;
	color:#006677;
	font-size:16px;
	width:auto;
	padding:5px 0px 5px 0px;
	margin:0px 0px 20px 0px;
	border-bottom:solid 3px #33aabb;
}

main article section.teachstyle p.sir {
	color:#006677;
	font-size:16px;
	width:auto;
	margin:0px 0px 10px 0px;
}

main article section.teachstyle dl.sir {
	width:auto;
	display:block;
	overflow:hidden;
	margin:0px 0px 20px 0px;
}

main article section.teachstyle dl.sir dt {
	color:#555555;
	font-size:16px;
	width:auto;
	margin:0px 10px 6px 0px;
	float:left;
	font-weight:bold;
	vertical-align:middle;
}

main article section.teachstyle dl.sir dd {
	padding:0px 0px 0px 0px;
	color:#555555;
	font-size:16px;
	width:auto;
	margin:0px 0px 0px 0px;
	float:left;
	vertical-align:middle;
}


/* ●●●　entrystyle　●●● */

main article section div.entrystyle {
	display:block;
	width:auto;
	height:auto;
	display: flow-root;
}

main article section div.entrystyle>*:last-child {margin-bottom:30px;}

main article section div.entrystyle h2 {
	font-family: "ZenKakuGothicNew";
	font-weight:900;
	display:block;
	overflow:hidden;
	color:#666666;
	font-size:28px;
	width:auto;
	padding:3px 10px 7px 10px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #666666;
	border-bottom:none;
	background:none;
}


main article section div.entrystyle h3 {
	font-family: "ZenKakuGothicNew";
	font-weight:700;
	display:block;
	overflow:hidden;
	color:#666666;
	font-size:25px;
	width:auto;
	padding:3px 10px 7px 10px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #999999;
	border-bottom:none;
	background:none;
}

main article section div.entrystyle h4 {
	font-family: "ZenKakuGothicNew";
	font-weight:500;
	display:block;
	overflow:hidden;
	color:#666666;
	font-size:22px;
	width:auto;
	padding:3px 7px 7px 7px;
	margin:0px 0px 20px 0px;
	border-left:solid 8px #999999;
	background:none;
}

main article section div.entrystyle h5 {
	font-family: "ZenKakuGothicNew";
	font-weight:500;
	display:block;
	overflow:hidden;
	color:#666666;
	font-size:19px;
	width:auto;
	padding:3px 0px 7px 0px;
	margin:0px 0px 20px 0px;
	border-bottom:dotted 2px #999;
	background:none;
}

main article section div.entrystyle h6 {
	font-family: "ZenKakuGothicNew";
	font-weight:500;
	display:block;
	overflow:hidden;
	color:#666666;
	font-size:16px;
	width:auto;
	padding:3px 0px 7px 0px;
	margin:0px 0px 20px 0px;
	border-bottom:dotted 2px #999;
	background:none;
}

main article section div.entrystyle p {
	color:#666666;
	font-size:16px;
	width:auto;
	margin:0px 0px 10px 0px;
}

main article section div.entrystyle p em {
	font-style:normal;
	color:#ff0000;
	background-color:#ffff77;
	padding:0px 3px 2px 3px;
}
main article section div.entrystyle p strong {
	font-weight:800;
	color:#666666;
	text-decoration: #ff0000 wavy underline;
	padding:0px 3px 2px 3px;
}

main article section div.entrystyle dl {
	width:auto;
	display:block;
	overflow:hidden;
	padding:0px 0px 0px 0px;
	margin:0px 0px 20px 0px;
	background-color:#FFFFFF;
	border:none;
	box-shadow: none;
}

main article section div.entrystyle dl dt {
	color:#555555;
	font-size:16px;
	font-weight:800;
	width:auto;
	padding:5px 0px 5px 0px;
	margin:0px 15px 0px 0px;
	float:left;
	border:none;
	vertical-align:baseline;
	line-height:100%;
}

main article section div.entrystyle dl dd {
	color:#555555;
	font-size:16px;
	width:auto;
	padding:5px 0px 5px 0px;
	margin:0px 0px 0px 0px;
	float:left;
	vertical-align:baseline;
	line-height:100%;
}

/* ●●●　コードHTMLタグ背景　●●● */

.tagbgh16{	background:url("https://cms.711css.com/wp-content/themes/711CSS_CoLtd/images/htmltagbg/tagdesign_h1h6tagbg.svg") no-repeat top left;}
.tagbga{	background:url("https://cms.711css.com/wp-content/themes/711CSS_CoLtd/images/htmltagbg/tagdesign_atagbg.svg") no-repeat top left;}


/* ●●●　リンクアイコン　●●● */
a {
	color:#0f7dff;
    text-decoration: none;
	line-height:100%;
	cursor: pointer;
	background-position:10px 0px;
    transition: 0.3s;
}

a:hover {
	color:#ff66bb;
}

a.ipdf {
	padding:2px 0px 0px 30px;
	min-height:24px;
	background: url("https://cms.711css.com/wp-content/themes/711CSS_CoLtd/images/icon/icon_pdf.svg") no-repeat;
	background-size:24px 24px;
}

a.ilink {
	padding:2px 0px 0px 30px;
	min-height:24px;
	background: url("https://cms.711css.com/wp-content/themes/711CSS_CoLtd/images/icon/icon_c_hyperlink.svg") no-repeat;
	background-size:24px 24px;
}

a.iloca {
	padding:2px 0px 0px 30px;
	min-height:24px;
	background: url("https://cms.711css.com/wp-content/themes/711CSS_CoLtd/images/icon/icon_c_location_info.svg") no-repeat;
	background-size:24px 24px;
}


main article section div.results_display {
	display:block;
	width:100%;
	height:auto;
	padding:0px 20px 20px 20px;
	margin-bottom:20px;
	border-left:8px solid #99eeee;
	background-image: linear-gradient(315deg, rgba(0, 255, 153, 0.1), rgba(255, 255, 255, 1) 5% 95%, rgba(0, 255, 153, 0.1));
}

main article section div.results_display::before {
	content: attr(data-title);
	display:block;
	width: 100%;
	padding:5px;
	color: #3c7896;
	font-size: 14px;
	font-weight:bold!important;
	margin-bottom:20px;
	background-image: linear-gradient(90deg, rgba(0, 255, 153, 0) 2%, rgba(0, 255, 153, 0.1) 20% 50%, rgba(0, 255, 153, 0) 98%);
}

main article section div.results_display>*,
main article section div.results_display div.entrystyle>*{margin-bottom:10px;}

main article section div.results_display>*:last-child,
main article section div.results_display div.entrystyle>*:last-child {margin-bottom:2px;}


/* ●●●　グリットデザイン　●●● */

.designsample_gridlayout {
	padding:20px;
	border:3px solid #88dddd;
	width:100%;
}

.designsample_gridlayout ul {
	display: grid;
	grid-template-columns: repeat(8, 1fr);/* fr=比pxもOK */
 	grid-auto-rows: 50px;/*箱の縦の長さ*/
	column-gap: 5px;/*横の隙間*/
	row-gap: 15px;/*縦の隙間*/
}

.designsample_gridlayout ul li {
	padding:10px;
	text-align:center;
	border: solid #666 2px;
	background-color:#ddffff;
	box-sizing: border-box;/*padding+border含めた計算*/
}

/*BOX範囲の指示*/
.box1 {
	grid-column-start: 1;
	grid-column-end: 4;
	grid-row-start: 1;
	grid-row-end: 3;
}

.box2 {
	grid-column-start: 1;
	grid-row-start: 3;
	grid-row-end: 5;
}

.box5 {
	grid-column-start: 6;
	grid-column-end: 7;
	grid-row-start: 2;
	grid-row-end: 6;
}





/* ●●●　レスポンシブデザイン　●●● */
	
	
/* ■■　ブレイクポイント1280px PC　■■ */
@media screen and (min-width:1281px) {

}/* 1281px以上で反映 end */
@media screen and (max-width:1280px) {

}/* 1280px以下で反映 end */





/* ■■　ブレイクポイント960px タブレット　■■ */
@media screen and (min-width:961px) {



}/* 961px以上で反映 end */



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



}/* 960px以下で反映 end */



/* ■■　ブレイクポイント768px タブレット　■■ */
@media screen and (min-width:769px) {

section.teachstyle

}/* 769px以上で反映 end */

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


main article section.teachstyle dl,
main article section div.entrystyle dl{
	width:100%;
	display:block;
	float:none;
	clear:both;
	}

main article section.teachstyle dl dt,
main article section div.entrystyle dl dt{
	width:100%;
	display:block;
	float:none;
	clear:both;	
}

main article section.teachstyle dl dd,
main article section div.entrystyle dl dd{
	width:100%;
	display:block;
	float:none;
	clear:both;	
}

a {
	color:#0f7dff;
    text-decoration: none;
	line-height:100%;
	cursor: pointer;
	background-position:10px 0px;
    transition: 0.3s;
}

a:hover {
	color:#ff66bb;
}







main article section *{
	line-height:130%;	
	}

main article section a{
	display:inline-block;
	overflow:hidden;
	overflow-wrap: break-word;
	word-break: break-all;
	word-wrap: break-word; /* 古いブラウザ用 */
	font-size:16px;
}
	
main article.default section h2,
main article section h2 span{font-size:18px;}
main article.default section h3,
main article section h3 span {font-size:17px;}
main article.default section h4,
main article section h4 span {font-size:16px;}
main article.default section h5,
main article section h5 span {font-size:15px;}
main article.default section h6,
main article section h6 span {font-size:14px;}

}/* 768px以下で反映 end */



/* ■■　ブレイクポイント428px SmartPhone　■■ */
@media screen and (min-width:429px) {

}/* 429px以上で反映 end */




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

}/* 428px以下で反映 end */