@charset "utf-8";
/*
Theme Name: 大分大学理工学部 受験生特設サイト
Theme URI:
Author:
*/
/* -------------------------------------------------- */
/* RESET*/
/* -------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}

li {
	list-style-type: none;
}

blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

img {
	max-width: 100%;
	vertical-align: bottom;
}

textarea,select,option {
	font: inherit;
}

button {
	font: inherit;
}

/* -------------------------------------------------- */
/* WP*/
/* -------------------------------------------------- */
/* 投稿の画像配置 */
.alignright { display: block; margin: 0 0 10px auto; }/* 配置位置 左 */
.alignleft { display: block; margin: 0 auto 10px 0; }/* 配置位置 右 */
.aligncenter { display: block; margin: 0 auto 10px; }/* 配置位置 中央 */
/* .alignright { float: right; padding: 0px 0 10px 10px; } *//* 後続のテキスト左回り込み */
/*.alignleft { float: left; padding: 0px 10px 10px 0; }*//* 後続テキスト右回り込み */

/* -------------------------------------------------- */
/* LINK */
/* -------------------------------------------------- */
a { text-decoration: none; color: #333333; }

/* -------------------------------------------------- */
/* CLEARFIX */
/* -------------------------------------------------- */
.cf:before,
.cf:after {
	content: " ";
	display: table;
}

.cf:after {
	clear: both;
}

.cf {
	*zoom: 1;
}

/* -------------------------------------------------- */
/* COMMON */
/* -------------------------------------------------- */
html {
	font-size: 62.5%;/* 10px */
}

body {
	background: #FFFFFF;
	color: #000000;
	font-size: 14px;
	font-size: 1.4rem;
	-webkit-text-size-adjust: 100%
}

body.noscroll {
	overflow: hidden;
}

#container {
	position: relative;
	font-family: "Zen Kaku Gothic New", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka,"ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.5;
	overflow: hidden;
}

* {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}


.brSp {
	display: none;
}

.brPc {
	display: inline-block;
}

.oswald {
	font-family: "Oswald", sans-serif;
}

.inner {
	width: 1080px;
	max-width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding: 0 40px;
}

.innerWide {
	width: 1280px;
	max-width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding: 0 40px;
}

/* -------------------------------------------------- */
/* PC*/
/* -------------------------------------------------- */
/* header */
/* ----------------------------------- */
#header {
	width: 100%;
	padding-block: 25px;
}

#headerInner {
	padding-right: 120px;
	padding-left: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#headerLogo a {
	display: flex;
	align-items: center;
	gap: 18px;
}

#headerLogoIcon img {
	width: 60px;
}

#headerLogoText {
	font-weight: 700;
}

#headerLogoText span:nth-child(1) {
	font-size: 2.9rem;
}

#headerLogoText span:nth-child(2) {
	display: block;
	font-size: 1.7rem;
	text-align: center;
	border: 1px solid #000;
}

#headerNavList {
	display: flex;
	gap: 25px;
}

.headerNavListItem a {
	padding: 18px 26px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 6px;
	font-size: 1.7rem;
	font-weight: 700;
	color: #f88335;
	background-color: #ffffff;
	border: 2px solid #f88335;
	border-radius: 40px;
}

.headerNavIcon {
	width: 20px;
	height: 20px;
	position: relative;
}

.headerNavIcon img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.headerNavIcon img:nth-child(2) {
	opacity: 0;
}

/* ハンバーガーメニュー */
#menuBtn {
	width: 72px;
	height: 72px;
	padding: 0;
	margin: 0;
	position: fixed;
	top: 25px;
	right: 30px;
	background-color: #f88335;
	border: none;
	border-radius: 50%;
	z-index: 21;
	cursor: pointer;
}

#menuBtn::after {
	content: "メニュー";
	position: absolute;
	top: 45px;
	left: 50%;
	transform: translateX(-50%);
	font-size: 1rem;
	white-space: nowrap;
	color: #fff;
}

.menuBtnBar {
	width: 24px;
	height: 2px;
	position: absolute;
	left: 24px;
	background-color: #FFFFFF;
	transition: 0.3s;
}

.menuBtnBar:nth-child(1) {
	top: 24px;
}
.menuBtnBar:nth-child(2) {
	top: 31px;
}
.menuBtnBar:nth-child(3) {
	top: 38px;
}

#menuBtn.open::after {
	content: "閉じる";
}

#menuBtn.open .menuBtnBar:nth-child(1) {
	top: 31px;
	transform: rotate(45deg);
}
#menuBtn.open .menuBtnBar:nth-child(2) {
	opacity: 0;
}
#menuBtn.open .menuBtnBar:nth-child(3) {
	top: 31px;
	transform: rotate(-45deg);
}

/* メニューの中身 */
#menu {
	width: 100%;
	height: 100%;
	padding-top: 120px;
	padding-bottom: 80px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20;
	background: #fceb81;
	background: url(./img/common/menu_bg_pc.png) no-repeat center center / cover;
	overflow-y: auto;
	display: none;
}

#menuListWrap {
	display: grid;
	grid-template-columns: repeat(3, 230px);
	justify-content: center;
	gap: 35px;
}

.menuList {
	display: flex;
	flex-direction: column;
	row-gap: 20px;
}

.menuList > li > a {
	padding: 10px 30px 10px 15px;
	display: block;
	font-size: 1.8rem;
	background: url(./img/common/icon_arrow_right_main.svg) no-repeat right 12px center / 12px;
	background-color: #ffffff;
}

.menuList > li > a.home {
	background-color: rgba(255, 255, 255, 0.5);
	border: 2px solid #ffffff;
}

.menuList > li > a.bg-color {
	color: #ffffff;
	background-color: #f88335;
	background-image: url(./img/common/icon_arrow_right_white.svg);
	border-color: #f88335;
}

.menuSubList {
	margin-top: 20px;
	display: flex;
	flex-direction: column;
	row-gap: 25px;
}

.menuSubList > li {
	position: relative;
	padding-left: 1.25em;
}

.menuSubList > li::before {
	content: "";
	width: 0.625em;
	height: 1px;
	position: absolute;
	top: 0.8em;
	left: 0;
	background: #000;
}

.menuSubList > li > a {
	font-size: 1.6rem;
	font-weight: 700;
}

/* title */
/* ----------------------------------- */
.title01 {
	margin-bottom: 30px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px 25px;
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.2;
}

/* .title01::before {
	content: attr(data-en);
	font-size: 5.6rem;
	font-weight: 700;
	font-family: "Oswald", sans-serif;
	letter-spacing: 0.1em;
} */

/* btn */
/* ----------------------------------- */
.btn {
	min-width: 290px;
	padding: 24px 70px 24px 50px;
	display: inline-block;
	font-size: 2rem;
	font-weight: 700;
	text-align: center;
	border: 1px solid #333333;
	border-radius: 60px;
	background: url(./img/common/icon_arrow_btn.svg) no-repeat right 20px center / 36px;
}

/* footer */
/* ----------------------------------- */
#footer {
	padding-top: 50px;
	padding-bottom: 70px;
	position: relative;
	background-color: #f3faf4;
}

#footerInner {
	display: flex;
	flex-direction: column;
	row-gap: 40px;
}

#footerLogo a {
	display: flex;
	align-items: center;
	gap: 12px;
}

#footerLogoIcon img {
	width: 46px;
}

#footerLogoText {
	font-size: 2.4rem;
	font-weight: 700;
}

#footerInfo {
	display: flex;
	flex-direction: column;
	row-gap: 5px;
	font-size: 1.8rem;
}

#footerCopyright {
	font-size: 1.4rem;
	opacity: 0.6;
}

/* 下層ページタイトル */
/* ----------------------------------- */
#pageHead {
	height: 320px;
	position: relative;
	background: linear-gradient(20deg,rgba(252, 235, 129, 1) 0%, rgba(254, 184, 49, 1) 70%);
}

#pageHeadInner {
	height: inherit;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

#pageTitle {
	position: relative;
	font-size: 5.4rem;
	font-weight: 700;
	text-align: center;
	color: #ffffff;
	z-index: 1;
}

/* #pageTitle::after {
	content: attr(data-en);
	margin-top: 10px;
	display: block;
	font-size: 2.2rem;
	font-family: "Oswald", sans-serif;
	font-weight: 500;
	letter-spacing: 0.1em;
} */

/* ニュース一覧
------------------------------------ */
.postListItem {
	border-bottom: 1px solid #d8d7d7;
}

.postListLink {
	padding: 20px 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
	align-items: center;
}

.postListDate {
	font-size: 1.4rem;
	letter-spacing: 0.025em;
}

.postListLabel {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}

.postListLabel li {
	min-width: 120px;
	padding: 4px 15px;
	font-size: 1.4rem;
	text-align: center;
	color: #f88335;
	border: 1px solid currentColor;
	border-radius: 40px;
}

.postListTitle {
	font-size: 1.6rem;
}

/* ------------------------------------ */
/* ホバーエフェクト */
/* ------------------------------------ */
@media screen and (min-width: 1025px) {
	.headerNavListItem a {
		transition: all 0.3s ease 0s;
	}

	.headerNavListItem a:hover {
		color: #ffffff;
		background-color: #f88335;
	}

	.headerNavListItem a img {
		transition: all 0.3s ease 0s;
	}

	.headerNavListItem a:hover img:nth-child(2) {
		opacity: 1;
	}

	#menuBtn {
		transition: all 0.3s ease 0s;
	}

	#menuBtn:hover {
		opacity: 0.7;
	}

	.menuList > li > a {
		transition: all 0.3s ease 0s;
	}

	.menuList > li > a:hover {
		opacity: 0.7;
	}

	.menuSubList > li > a {
		transition: all 0.3s ease 0s;
	}

	.menuSubList > li > a:hover {
		color: #f88335;
	}

	.btn {
		transition: all 0.3s ease 0s;
	}

	.btn:hover {
		color: #ffffff;
		background-color: #f88335;
		border-color: #f88335;
	}

	.postListLink {
		transition: all 0.3s ease 0s;
	}

	.postListLink:hover  {
		color: #f88335;
	}
}

/* -------------------------------------------------- */
/* TAB&SP */
/* -------------------------------------------------- */
@media screen and (max-width: 1024px) {
	#container {
		font-family: "Hiragino Sans", "Noto Sans CJK JP", sans-serif;
	}

	/* header */
	/* ----------------------------------- */
	#headerNav {
		display: none;
	}

	#menuListWrap {
		gap: 20px;
	}

	/* title */
	/* ----------------------------------- */
	/* btn */
	/* ----------------------------------- */
	/* footer */
	/* ----------------------------------- */

	/* ニュース一覧
	------------------------------------ */
	.postListLink {
		grid-template-columns: 120px 100px auto;
	}

	.postListDate {
		letter-spacing: 0;
	}
}


/* -------------------------------------------------- */
/* TAB(調整) */
/* -------------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.inner,
	.innerWide {
		padding: 0 30px;
	}

	#menuListWrap {
		grid-template-columns: repeat(3, 220px);
	}

	.menuList > li > a {
		font-size: 1.7rem;
	}

	.menuSubList {
		row-gap: 23px;
	}

	.menuSubList > li > a {
		font-size: 1.5rem;
	}
}
/* -------------------------------------------------- */
/* SP(調整) */
/* -------------------------------------------------- */
@media screen and (max-width: 767px) {
	.brSp {
		display: inline-block;
	}
	
	.brPc {
		display: none;
	}

	.inner,
	.innerWide {
		padding: 0 20px;
	}

	/* header */
	/* ----------------------------------- */
	#header {
		padding-block: 15px;
	}

	#headerInner {
		padding-inline: 20px;
	}

	#headerLogo a {
		gap: 10px;
	}

	#headerLogoIcon img {
		width: 35px;
	}

	#headerLogoText span:nth-child(1) {
		font-size: 1.8rem;
	}

	#headerLogoText span:nth-child(2) {
		display: block;
		font-size: 1rem;
	}

	/* ハンバーガーメニュー */
	#menuBtn {
		width: 50px;
		height: 50px;
		top: 10px;
		right: 20px;
	}

	#menuBtn::after {
		top: 29px;
		font-size: 0.9rem;
	}

	.menuBtnBar {
		width: 24px;
		height: 1px;
		left: 13px;
	}

	.menuBtnBar:nth-child(1) {
		top: 12px;
	}
	.menuBtnBar:nth-child(2) {
		top: 18px;
	}
	.menuBtnBar:nth-child(3) {
		top: 24px;
	}

	#menuBtn.open .menuBtnBar:nth-child(1),
	#menuBtn.open .menuBtnBar:nth-child(3) {
		top: 18px;
	}

	/* メニューの中身 */
	.menuList {
		row-gap: 20px;
	}

	#menuListWrap {
		grid-template-columns: auto;
		justify-content: normal;
	}

	.menuList > li > a {
		font-size: 1.6rem;
	}

	.menuSubList {
		margin-top: 14px;
		row-gap: 14px;
	}

	/* title */
	/* ----------------------------------- */
	.title01 {
		gap: 15px;
		font-size: 1.7rem;
	}

	/* .title01::before {
		font-size: 3.4rem;
		letter-spacing: 0.05em;
	} */

	/* btn */
	/* ----------------------------------- */
	.btn {
		padding: 20px 60px 20px 40px;
		font-size: 1.6rem;
		background-size: 30px;
	}

	/* footer */
	/* ----------------------------------- */
	#footer {
		padding-bottom: 30px;
	}

	#footerInner {
		row-gap: 20px;
	}

	#footerLogo a {
		gap: 8px;
	}

	#footerLogoIcon img {
		width: 25px;
	}

	#footerLogoText {
		font-size: 1.5rem;
	}

	#footerInfo {
		font-size: 1.4rem;
	}

	#footerCopyright {
		font-size: 1.1rem;
	}

	/* 下層ページタイトル */
	/* ----------------------------------- */
	#pageHead {
		height: 160px;
	}

	#pageTitle {
		font-size: 3.2rem;
	}

	/* #pageTitle::after {
		margin-top: 0;
		font-size: 1.6rem;
	} */

	/* ニュース一覧
	------------------------------------ */
	.postListLink {
		grid-template-columns: 120px auto;
		gap: 10px 10px;
		justify-items: start;
	}

	.postListDate {
		font-size: 1.3rem;
	}

	.postListLabel li {
		padding: 2px 6px;
		font-size: 1.2rem;
		min-width: 100px;
	}

	.postListTitle {
		grid-column: 1 / 3;
		font-size: 1.4rem;
	}
}

@media screen and (max-width: 374px) {
	html {
		font-size: 2.667vw;
	}
}