.sp-only {
	display:none;
}
/*---PC---*/
@media screen and  (min-width: 961px){
#menu {
	display:none;
}
}

/*---SmartPhone---*/
@media screen and  (max-width: 960px){
*{
	/* ios対策 */
    /*-webkit-appearance: none;*/
	border-radius: 0;
}

.sp-only {
	display:block;
}

body{
	min-width:320px;
	margin:0;	
	-webkit-text-size-adjust : none;
}

/*----------------------------------none----------------------------------*/
#hmenu,
#gmenu,
#footer-page-top,
.pc-only {
	display:none;
}

/*-----------------bg_body-----------------*/
#bg_body{
	min-width:100%;
}

/*----------------------------------header----------------------------------*/
#header,
#header-inn,
#header-inn2 {
	width: 100%;
	min-width:100%;
}

#header #header-inn {
	background-image: none;
	padding:0 0 10px;
}

#header-inn2 {
	margin: 0 auto;
}

#header-inn2 h1 {
	height: 50px;
	/*height:41px;*/	/* logo height chang 161224 */
	margin: 0;
	width: 99px;
}

#srhbox {
	min-width:100%;
}


/*----------------------------------sp-menu----------------------------------*/
div.sp-menu {
	display: block;
	height: 50px;
	position: fixed;
	right: 0;
	top: 0;
	width: 60px;
	z-index: 2000;
}

div.sp-menu a {
	background: rgba(0, 0, 0, 0) url("../../images/global-sp/sp-menu.png") no-repeat scroll 0 0;
	background-size:60px 50px;
	display: block;
	font-size: 1px;
	height: 50px;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	width: 60px;
}

#menu {
    padding: 0 0 30px;
    text-align: left;
    background:url("../../images/global/h_bg2.gif") repeat left top;
    z-index:2000;
}
ul.sp-glnavi {
    margin: 0 5px 5px;
}

ul.sp-glnavi li {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #fff;
    margin: 0 0 1px;
    position:relative;
}
ul.sp-glnavi li a {
    background: #fff;
    border-left: 4px solid #ff322f;
    cursor: pointer;
    display: block;
    margin: 0 5px 0 0;
    padding: 15px 30px;
}
ul.sp-glnavi li a::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 7px;
	height: 7px;
	border-top: 2px solid #ff322f;
	border-right: 2px solid #ff322f;
	transform: rotate(45deg);
	margin-top: -5px;
}

ul.sp-langnavi {
    margin: 0 5px 5px;
}

ul.sp-langnavi li {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #fff;
    margin: 0 0 1px;
    position:relative;
}
ul.sp-langnavi li a {
    background: #fff;
    border-left: 4px solid #a32042;
    cursor: pointer;
    display: block;
    margin: 0 5px 0 0;
    padding: 15px 30px;
}
ul.sp-langnavi li.eng a {
    border-left: 4px solid #d05904;
}
ul.sp-langnavi li a::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 7px;
	height: 7px;
	border-top: 2px solid #a32042;
	border-right: 2px solid #a32042;
	transform: rotate(45deg);
	margin-top: -5px;
}
ul.sp-langnavi li.eng a::after{
	border-top: 2px solid #d05904;
	border-right: 2px solid #d05904;
}

#menu a.close {
    background: rgba(0, 0, 0, 0) url("../../images/global-sp/close-btn.png") no-repeat scroll center center;
    background-size:90px 40px;
    display: block;
    font-size: 1px;
    height: 40px;
    margin: 30px 9px 0;
    text-indent: -9999px;
}

/*-------------------------------------------------------*/
/*　FOOTER                                                  */
/*-------------------------------------------------------*/
#footer {
	min-width: 100%;
	background-image:none;
	padding:20px 0 44px;
	margin-top:0;
}
#footer #footer_bnr {
	width: 236px;
}
#footer .footer-inn {
	width: 90%;
}
#footer #footer_menu ul#fmenu01 {
	width: 90%;
}
#footer #footer_menu02 #copy {
	display: block;
	margin: 0 0 10px 0;
}
#footer #footer_menu03 {
	left:0;
	bottom: 0;
	height: 44px;
	position: fixed;
	width: 100%;
	z-index: 1500;
}
#footer #footer_menu03 {
	display: block;
	margin: 0;
	padding: 0;
}
#footer #footer_menu03 ul li {
	background-color: #fff;
	border-right: 1px solid #ccc;
	border-top: 4px solid #ff322f;
	float: left;
	font-weight: normal;
	height: 44px;
	line-height: 30px;
	margin: 0;
	padding: 5px;
	text-align: center;
	width: 33%;
	font-size:14px;
}
#footer #footer_menu03 ul li:nth-child(3) {
	width: 34%;
}
#footer #footer_menu03.en ul li {
	width: 27%;
}
#footer #footer_menu03.en ul li:nth-child(3) {
	width: 46%;
}
#footer #footer_menu03 ul li a:link    {color:#21180e;}
#footer #footer_menu03 ul li a:visited {color:#21180e;}
#footer #footer_menu03 ul li a:active  {color:#21180e;}
#footer #footer_menu03 ul li a:hover   {color:#21180e;}

/*-------------------------------------------------------*/
/*　container                                            */
/*-------------------------------------------------------*/
#container {
	margin: 0;
	top:0;
}

/*-------------------------------------------------------*/
/*　パン屑                                               */
/*-------------------------------------------------------*/
#container #pankuzu {
	padding: 10px;
	width: 100%;
}

/*-------------------------------------------------------*/
/*　下層ページ                                           */
/*-------------------------------------------------------*/
#contents {
	padding: 10px;
	width: 100%;
}

#contents #pagetlt h2 {
	font-size: 150%;
}

#contents #pagetlt h2 span {
	display:block;
	padding: 0;
}

#contents .section {
	margin: 0 0 40px;
}

#contents h3 {
	font-size: 120%;
}

#contents h3.type_topics {
	font-size: 120%;
	padding: 6px 10px 0;
}

#contents　h4.type_topics {
	font-size: 105%;
}
#contents　h4.type_topics::before {
	padding: 0 0 0 10px;
}

/*-----------------写真とテキストレイアウト-----------------*/
#contents .left-a {
	float:none;
	width:100%;
}
#contents .right-a {
	float:none;
	width:100%;
}
#contents .left-b {
	float:none;
	width:100%;
}
#contents .right-b {
	float:none;
	width:100%;
}

#contents .left-c {
	float:none;
	width:100%;
}
#contents .right-c {
	float:none;
	width:100%;
}

#contents .left-d {
	float:none;
	width:100%;
}
#contents .right-d {
	float:none;
	width:100%;
}

#contents .box-2c {
	float:none;
	width:100%;
	margin:0 0 10px 0;
}
#contents .box-3c {
	float:none;
	width:100%;
	margin:0 0 10px 0;
}
#contents .box-5c {
	float:none;
	width:100%;
	margin:0 0 10px 0;
}

/*-----------------How to Createトップ-----------------*/
#contents .htc-index .item .logo {
	float:none;
	width:100%;
}

#contents .htc-index .item .text {
	float:none;
	width:100%;
	padding:15px 15px;
}

#contents .htc-index .item .text h3 {
	font-size:150%;
}

#contents .htc-index .item .text ul.btn {
	position:static;
}

#contents .htc-index .item .text ul.btn li {
	display:block;
	padding:0 1em 0 2em;
	text-indent:-2.5em;
	border:1px solid #fff;
	border-radius:3px;
	margin:0 0 10px 0;
	text-align:center;
}

/*-----------------How to Create 作成手順Step-----------------*/
#contents div.step {
	border-top: 2px solid #8a8ca5;
	border-left:none;
}
#contents div.step img {
	vertical-align:middle;
}
#contents div.step div.box,
#contents div.step div.box.column3 {
	border-left: 2px solid #8a8ca5;
	float: none;
	width: 100%;
}
#contents div.step div.box:nth-child(4n),
#contents div.step div.box:nth-child(4n+3),
#contents div.step div.box.column3:nth-child(3n),
#contents div.step div.box.column3:nth-child(3n+2) {
	width: 100%;
}
#contents div.step div.box:nth-child(4n+2) img {
	position:static;
	margin:auto;
	display:block;
	padding:10px;
}

/*-----------------Topics共通-----------------*/
#contents .tp-inn form {
	text-align:center;
	position:relative;
}

#contents .tp-inn select,
#contents .tp-inn input[type=text] {
	display:block;
	width:100%;
	margin:0 0 10px;
	font-size:16px;
}
#contents .tp-inn input  {
	top:auto;
}
#contents .tp-inn input[type=text] {
	display:inline-block;
	width:100%;
	padding-right:40px;
	-webkit-appearance: none;
}
#contents .tp-inn input.srhbtn  {
	position:absolute;
	right:0;
}

/*-----------------Topicsトップ-----------------*/
#contents #topics-index h3 {
	font-size:125%;
}

#contents #topics-index #latest .tp_tltbox .photo {
	float:none;
	width:100%;
	height:auto;
}

#contents #topics-index #latest .tp_tltbox .photo img {
	position:static;
}

#contents #topics-index #latest .tp_tltbox .text {
	float:none;
	width:100%;
}

#contents #topics-index #latest .tp_tltbox .text h4 {
	font-size:180%;
	padding:10px;
}
#contents #topics-index #latest .tp_tltbox .text p.name {
  	padding: 0 10px;
}

/*-----------------Topics詳細-----------------*/
#contents #topics .tp_tltbox .photo {
	float:none;
	width:100%;
	height:auto;
}

#contents #topics .tp_tltbox .photo img {
	position:static;
}

#contents #topics .tp_tltbox .text {
	float:none;
	width:100%;
}

#contents #topics .tp_tltbox .text h3 {
	font-size:180%;
	padding:10px;
}
#contents #topics .tp_tltbox .text p.name {
  	padding: 0 10px;
}

#contents #topics .section {
	margin: 0 10px 40px;
}

#contents #topics h3 {
	font-size: 120%;
	padding: 6px 10px 0;
}

#contents #topics h4 {
	font-size: 105%;
}
#contents #topics h4::before {
	padding: 0 0 0 10px;
}


/*-----------------Projectsトップ-----------------*/
#contents .projects-index .box-2c{
	min-height:auto;
}
#contents .projects-index .box-2c .logo {
	float:none;
	width:100%;
}
#contents .projects-index .box-2c .logo img {
	position:relative;
	display:block;
}
#contents .projects-index .box-2c .logo img:before {
	content:"";
    display: block;
    padding-top: 75%; /* 高さを幅の75%に固定 */
}
#contents .projects-index .box-2c .text {
	float:none;
	width:100%;
}

/*-----------------Projects詳細-----------------*/
#contents #projects .section {
	margin: 0 10px 40px;
}

#contents #projects .pr_tltbox {
	min-height:autopx;
}

#contents #projects .pr_tltbox .photo {
	float:none;
	width:100%;
	height:auto;
}

#contents #projects .pr_tltbox .text {
	float:none;
	width:100%;
	height:auto;
}

#contents #projects .pr_tltbox .text h2 {
	font-size:268%;
}

#contents #projects .pr_tltbox .text p {
	width:95%;
	margin:0 auto 20px;
}

#contents #projects .pr-logobox {
	margin:0 0 20px;
}

#contents #projects iframe {
	width:100%;
	height:auto;
	border:10px solid #000;
	position:relative;
}
#contents #projects iframe:before {
	content:"";
    display: block;
    padding-top: 56%; /* 高さを幅の56%に固定 */
}
#contents #projects .baloon:before {
	left: 50%;
	top: -13px;
	margin-left: -17px;
	margin-top:0;
	border-width: 0 13px 13px 13px;
	border-color: transparent transparent #fff transparent;
}
#contents #projects .baloon:after {
	left: 50%;
	top: -14px;
	margin-left: -18px;
	margin-top:0;
	border-width: 0 14px 14px 14px;
	border-color: transparent transparent #ccc transparent;
}
#contents #projects .relation ul li {
	float:none;
	width:100%;
	margin:0 0 10px;
}
#contents #projects .box-2c .left-c,
#contents #projects .box-2c .right-c {
	width:100%;
}

/*
#contents #projects .tp-list .box-2c .photo {
	display:block;
	float:none;
	width:100%;
}

#contents #projects .tp-list .box-2c .photo img {
	margin:0 auto;
	padding:10px;
}

#contents #projects .tp-list .box-2c .text {
	display:block;
	float:none;
	width:100%;
	padding:5px 10px;
}
*/

#contents #projects .tp-list .box-2c .text h4 {
	border:none;
	padding:0;
	margin:0 0 10px;
	color:#fff;
}

#contents #projects .tp-list .box-2c .text p {
	font-size:80%;
	margin:0 0 10px;
}

#contents #projects .tp-list .box-2c .text ul.btn {
	text-align:center;
	font-size:90%;
}
#contents #projects .class-list .box-5c {
	float:left;
}
#contents #projects .projects-list ul {
	width:100%;
}
#contents #projects .projects-list ul li {
	display:block;
	margin:0 0 10px;
}
#contents #projects .projects-list ul li a img {
	margin:0 auto;
}
#contents #projects .tp-list .box-2c .photo, 
#contents #projects .tp-report .photo {
	float: none;
	height: auto;
	min-height: auto;
	width: 100%;
}
#contents #projects .tp-list .box-2c .photo img, 
#contents #projects .tp-report .photo img {
	position: static;
}
#contents #projects .tp-list .box-2c .text, 
#contents #projects .tp-report .text {
	float: none;
	height: auto;
	min-height: auto;
	width: 100%;
}

/*-----------------NEWS-----------------*/
#contents div.news-area dl dt {
	display: block;
	float: none;
}
#contents div.news-area dl dd {
	padding: 0;
}

/*-----------------News(Topicsデザイン流用)-----------------*/
#contents.news-contents h3 {
	font-size: 120%;
	padding: 6px 10px 0;
}

#contents.news-contents h4 {
	font-size: 105%;
}
#contents.news-contents h4::before {
	padding: 0 0 0 10px;
}

/*-----------------お問合せフォーム-----------------*/
#contents #inquiryform input[type=text], 
#contents #inquiryform textarea, 
#contents #inquiryform select {
	width:100%;
}
#contents #inquiryform .textC input {
	display: block;
	margin: 5px auto;
	width:80%;
}

/*-----------------table-----------------*/
#contents table.restb01 {
    border: none;
}

#contents table.restb01 thead {
	display: none;
}

#contents table.restb01 tbody tr th,
#contents table.restb01 tbody tr td {
    display: block;
	vertical-align: top;
	text-align:left;
	border:none;
	padding:5px;
	width:100%;
}

#contents table.restb01 tbody tr th {
	font-weight:bold;
}


/*-------------------------------------------------------*/
/*　TOP                                                  */
/*-------------------------------------------------------*/
/*-----------------bg_body-----------------*/
#bg_body{
	background-size:
		100% auto,
		auto;
}
.bg_effect {
	display:none;
}
.section-inn {
	width: 100%;
}
/*----------------------------------movie----------------------------------*/
#movie,
video {
	width:100%;
	height:auto;
}
/*----------------------------------mainvisual----------------------------------*/
#mainvisual {
	margin: 0 0 20px;
}

#mainvisual #mainvisual-inn {
	width: 100%;
	margin:0 auto;
}
#mainvisual #mainvisual-inn #red_string {
	display:none;
}

#mainvisual #mainvisual-inn  ul.slick-dots{
	bottom:0;
	left:0;
	text-align:center;
	display:block;
}

/*-----------------section01-----------------*/
#section01 {
	padding:50px 0 0;
}

#section01 .section-inn {
	width:100%;
	margin:0 auto 40px;
	padding:0 0 50px;
	background-size:100% auto;
}

#section01 .section-inn h2 {
	background-size:50% auto;
	font-size: 150%;
	line-height: 2.2;
	margin: 0 0 34px;
	text-align: center;
}

#section01 .section-inn p {
	font-size: 120%;
	width: 90%;
}

/*-----------------section02-----------------*/
#section02 {
	margin: 0 0 40px;
}
#section02 #projects {
	padding: 20px 0;
}
#section02 #projects h2 {
	font-size: 150%;
	width: 95%;
	max-width:325px;
}
#section02 #projects #projects-inn {
	padding: 16px 0 46px;
	width: 90%;
}
#section02 #projects #projects-inn h3 {
	  font-size: 120%;
	  margin: 0 0 23px;
}
#section02 #projects #projects-inn #projects-list li img {
	display:block;
	margin:0 auto;
}
#section02 #projects #projects-inn #projects-list li .item {
	width: 90%;
}
#section02 #projects #projects-inn #projects-list li .item .item-tlt {
	background-image:none;
}

/*-----------------section03-----------------*/
#section03 {
	margin: 0 0 20px;
	padding: 20px 0;
}
#section03 #topics h2 {
	font-size: 150%;
	width: 90%;
}
#section03 #topics #topics-inn {
	padding: 16px 0;
	width: 90%;
}
#section03 #topics #topics-list {
	margin: 0 auto;
	width: 247px;
}
#section03 #topics #topics-list li {
	/*float: none;*/
	margin: 0 auto 20px;
	width: 247px;
}
#section03 #topics #topics-list li:nth-child(4n) {
	margin: 0 auto 20px;
}
#section03 .section-inn2 {
	margin: 20px auto;
	width: 90%;
}
#section03 #wooden_box {
	float: none;
	width: 100%;
	height: auto;
	margin:0 auto 20px;
}
#section03 #wooden:before {
	content:"";
    display: block;
    padding-top: 96%; /* 高さを幅の96%に固定 */
}
#section03 #wooden .front,
#section03 #wooden .back {
    width: 100%;
	height:auto;
	top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
#section03 #news_box {
	float: none;
	width: 100%;
	margin:0 auto 20px;
}
#section03 #news_box div.news-area dl dt {
	display: block;
	float: none;
}
#section03 #news_box div.news-area dl dd {
	padding: 0;
}

/*-----------------section04-----------------*/
#section04 {
	padding: 20px 0;
}
#section04 #howto {
	padding: 20px 0;
}
#section04 #howto h2 {
	font-size: 130%;
	width: 90%;
}
#section04 #howto #howto-inn {
	width: 90%;
}
#section04 #howto #howto-inn h3 {
	font-size: 120%;
}
#section04 #howto #howto-inn ul#howto_list li {
	float: none;
	width: 100%;
	max-width:333px;
	background-image:none;
	position: relative;
	height:auto;
	margin:auto;
}
#section04 #howto #howto-inn ul#howto_list li a {
	/*display:block;*/
	margin:45px auto;
}
/*
#section04 #howto #howto-inn ul#howto_list li a:after {
	content: "";
	position: absolute;
	bottom: 15px;
	left: 50%;
	width: 15px;
	height: 15px;
	border-top: 3px solid #fff;
	border-right: 3px solid #fff;
	transform: rotate(45deg);
	margin-top: -12px;
	margin-left:-7px;
}
*/

/*-----------------section05-----------------*/
#section05 {
	padding: 20px 0;
}
#section05 .section-inn {
	width: 90%;
}
#section05 .section-inn #quiz {
	margin: 28px 0 0;
	padding: 20px;
	background-size:100% auto;
}
#section05 .section-inn #quiz h3 {
	font-size: 120%;
	padding: 12px 0;
}
#section05 .section-inn #quiz_bottom {
	margin: -20px 0 0;
}

/*** 190121 add start ***/
#contents #topics-index #latest .tp_tltbox .text h5.name {
	padding: 0 10px;
}
#contents #topics .tp_tltbox .text h4.name {
	padding: 0 10px;
}
/*** 190121 add start ***/


/*-----------------Teaching Online-----------------*/
#contents #teaching-online .section {
	margin: 0 10px 40px;
}

#contents #teaching-online .pr_tltbox {
	min-height:autopx;
}

#contents #teaching-online .pr_tltbox .photo {
	float:none;
	width:100%;
	height:auto;
}

#contents #teaching-online .pr_tltbox .text {
	float:none;
	width:100%;
	height:auto;
}

#contents #teaching-online .pr_tltbox .text h2 {
	font-size:268%;
}

#contents #teaching-online .pr_tltbox .text p {
	width:95%;
	margin:0 auto 20px;
}

#contents #teaching-online .pr-logobox {
	margin:0 0 20px;
}

#contents #teaching-online iframe {
	width:100%;
	height:auto;
	border:10px solid #000;
	position:relative;
}
#contents #teaching-online iframe:before {
	content:"";
    display: block;
    padding-top: 56%; /* 高さを幅の56%に固定 */
}
#contents #teaching-online .baloon:before {
	left: 50%;
	top: -13px;
	margin-left: -17px;
	margin-top:0;
	border-width: 0 13px 13px 13px;
	border-color: transparent transparent #fff transparent;
}
#contents #teaching-online .baloon:after {
	left: 50%;
	top: -14px;
	margin-left: -18px;
	margin-top:0;
	border-width: 0 14px 14px 14px;
	border-color: transparent transparent #ccc transparent;
}
#contents #teaching-online .relation ul li {
	float:none;
	width:100%;
	margin:0 0 10px;
}
#contents #teaching-online .box-2c .left-c,
#contents #teaching-online .box-2c .right-c {
	width:100%;
}

/*
#contents #teaching-online .tp-list .box-2c .photo {
	display:block;
	float:none;
	width:100%;
}

#contents #teaching-online .tp-list .box-2c .photo img {
	margin:0 auto;
	padding:10px;
}

#contents #teaching-online .tp-list .box-2c .text {
	display:block;
	float:none;
	width:100%;
	padding:5px 10px;
}
*/

#contents #teaching-online .tp-list .box-2c .text h4 {
	border:none;
	padding:0;
	margin:0 0 10px;
	color:#fff;
}

#contents #teaching-online .tp-list .box-2c .text p {
	font-size:80%;
	margin:0 0 10px;
}

#contents #teaching-online .tp-list .box-2c .text ul.btn {
	text-align:center;
	font-size:90%;
}
#contents #teaching-online .class-list .box-5c {
	float:left;
}
#contents #teaching-online .projects-list ul {
	width:100%;
}
#contents #teaching-online .projects-list ul li {
	display:block;
	margin:0 0 10px;
}
#contents #teaching-online .projects-list ul li a img {
	margin:0 auto;
}
#contents #teaching-online .tp-list .box-2c .photo, 
#contents #teaching-online .tp-report .photo {
	float: none;
	height: auto;
	min-height: auto;
	width: 100%;
}
#contents #teaching-online .tp-list .box-2c .photo img, 
#contents #teaching-online .tp-report .photo img {
	position: static;
}
#contents #teaching-online .tp-list .box-2c .text, 
#contents #teaching-online .tp-report .text {
	float: none;
	height: auto;
	min-height: auto;
	width: 100%;
}

#contents #teaching-online .tp_tltbox .photo {
	float:none;
	width:100%;
	height:auto;
}

#contents #teaching-online .tp_tltbox .photo img {
	position:static;
}

#contents #teaching-online .tp_tltbox .text {
	float:none;
	width:100%;
}

#contents #teaching-online .tp_tltbox .text h3 {
	font-size:180%;
	padding:10px;
}
#contents #teaching-online .tp_tltbox .text p.name {
  	padding: 0 10px;
}
#contents #teaching-online .tp_tltbox .text h4.name {
	padding: 0 10px;
}

}