@charset "UTF-8";
/* ******************************************************** *
 *           筑波大学  夏休み自由研究お助け隊2022           *
 *                                                          *
 *   main2.css                                              *
 * ******************************************************** */


/* *** for both PC and mobile ***************************** */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&family=Noto+Serif+JP:wght@300&display=swap');

body, main, nav, div#footer {
	font-family: 'Noto Sans JP','Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	color:#333;
}

main div.section h2 {
	font-size: 0.9rem;
	width:100%;
}

main div.section h3 {
	font-size: 0.9rem;
	width:100%;
}

main article#info {
	text-align:center;
}

main article#info ul {
	padding:0;
}

main article#info ul li {
	text-align:left;
	font-size:0.8rem;
	padding:0;
	margin-bottom: 5px;
}

select#inq_theme {
	color:#CCCCCC;
}

.greets {
	font-family: "Noto Serif JP";
	letter-spacing:0.1rem;
}

.bg-myinfo {
	background-color:#57c3ea;
}

.date-notice {
	width:45px;
}

.bg-myblue {
	background-color:#0068b7;
}

.mylogo-pic {
	width:115px;
}

.mybanner {
	width:180px;
}


/* *** for PC 1200 <  ********************************************* */
@media screen and (min-width: 1200px) {

nav, main, div#footer {
	max-width: 1180px;
	margin: 0 auto;
}
}

/* *** for PC 992 < 1200  ********************************************* */
@media screen and (min-width: 992px) and (max-width: 1200px) {

nav, main, div#footer {
	max-width: 980px;
	margin: 0 auto;
}
}

/* *** for PC 768 < 992  ********************************************* */
@media screen and (min-width: 768px) and (max-width: 992px) {

nav, main, div#footer {
	max-width: 750px;
	margin: 0 auto;
}
}

/* *** for PC < 768  ********************************************* */
@media screen and (min-width: 768px) {

div#eyecatch h1 img {
	width: 100%;
}

main {
	clear:both;
}

main * {
	margin:0;
	padding:5px;
}

main div.section {
	display:block;
	float:left;
}

div.accordion, div.accordion * {
	border: 0;
}

div#twitter {
	max-width:100%;
}

main div#right_zone article {
	margin-bottom:10px;
}


main div#right_zone div {
	width:100%;
	border-width: 0 0 1px 1px;
	border-style: solid;
	border-color: #333399;
	font-size:0.9rem;
	margin:0 0 5px 0;
}

main div#right_zone div p {
	margin:0;
	padding:0;
}

main article#info ul li h2 {
	font-size:0.9rem;
}


div.fullzone_nav {
	border-width: 0 0 1px 1px;
	border-style: solid;
	border-color: #333399;
}


div#footer {
	clear:both;
	text-align:center;
	margin-bottom:18px;
}

hr.linear-line { 
  border: 0; 
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #ffffff, #6666ff, #ffffff);
  background-image: -moz-linear-gradient(left, #ffffff, #6666ff, #ffffff);
  background-image: -ms-linear-gradient(left, #ffffff, #6666ff, #ffffff);
  background-image: -o-linear-gradient(left, #ffffff, #6666ff, #ffffff); 
}

img.theme_pic {
	width:95%;
}

.mynav-ul {
	width:100%;
}
.mynav-li2 {
  flex: 0 0 auto;
  width: 16.66666667%;
  text-align:center;
}

.mynav-li3 {
  flex: 0 0 auto;
  width: 25%;
  text-align:center;
}

.mynav-li3r {
  flex: 0 0 auto;
  width: 25%;
  text-align:right;
}

.mynav-li4 {
  flex: 0 0 auto;
  width: 33.33333333%;
  text-align:center;
}

.mynav-li5 {
  flex: 0 0 auto;
  width: 41.66666667%;
  text-align:center;
}

.mylogo {
	margin-left: 5px;
}


}
/* *** for mobile ***************************************** */
@media screen and (max-width: 768px) {

main, nav, div#footer {
	max-width: 100%;
	margin: 0 auto;
}


div#eyecatch {
	max-width: 100%;
	margin: 0 auto;
}

div#eyecatch h1 img {
	width:100%;
}

div.section {
	width:100%;
}

main div.section {
	width:100%;
}

main article#info ul li h2 {
	font-size:0.9rem;
	padding:2px;
	margin:0;
}

main article#info ul li:nth-child(n+4) {
	display:none;
}


div#footer {
	text-align:center;
	margin-bottom:10px;
}


hr.linear-line { 
  border: 0; 
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #ffffff, #6666ff, #ffffff);
  background-image: -moz-linear-gradient(left, #ffffff, #6666ff, #ffffff);
  background-image: -ms-linear-gradient(left, #ffffff, #6666ff, #ffffff);
  background-image: -o-linear-gradient(left, #ffffff, #6666ff, #ffffff); 
}
img.theme_pic {
	width:90%;
}

.mynav-li2 { }
.mynav-li3 { }
.mynav-li4 { }
.mynav-li5 { }
.mylogo { }

}