@charset "utf-8";


/*------------------------------------------------------

	index

------------------------------------------------------*/
#journal.index .contents > .container > .text { max-width: 770px; margin-left: auto; margin-right: auto; }
#journal.index .journal-wrap .journal-contents article > div .btn-c a { padding: 12px 10px; }

#journal.index #page-title { background: url(/campusview/journal/images/st_pagetitle.jpg) no-repeat center / cover; }


/* 左カラム */
.journal-wrap .journal-contents .sub-title { border-left: 10px solid #665EC0; color: #393472; font-weight: bold; position: relative; padding-left: 10px; }
.journal-wrap .journal-contents .post-category { border: 1px solid #665EC0; color: #393472; font-size: 1.4rem; font-weight: bold; padding: 5px 11px; letter-spacing: 0.1em; margin-right: 10px; line-height: 1; }
.journal-wrap .journal-contents .post-date { color: #393472; font-weight: bold; vertical-align: bottom; display: block; }
.journal-wrap .journal-contents .journal-contents article .title { line-height: 1.4; }
.journal-wrap .journal-contents .category-wrap { display: -webkit-box; display: flex; flex-wrap: wrap; gap: 10px 0; }

/* サイドバー */
.journal-wrap aside .sub-title { border-left: 10px solid #665EC0; color: #393472; font-weight: bold; position: relative; padding-left: 10px; }
.journal-wrap aside .post-category { border: 1px solid #665EC0; color: #393472; font-size: 1.4rem; font-weight: bold; padding: 5px 11px; letter-spacing: 0.1em; margin-right: 10px; line-height: 1; }
.journal-wrap aside .post-date { color: #393472; font-weight: bold; vertical-align: bottom; display: block; }
.journal-wrap aside .journal-contents article .title { line-height: 1.4; }
.journal-wrap aside .side-title { background: #665EC0; text-align: center; color: #fff; font-size: 1.8rem; letter-spacing: 0.1em; padding: 9px 10px; }
.journal-wrap aside .category nav ul { border-left: 1px solid; border-right: 1px solid; border-bottom: 1px solid; border-color: #665EC0; }
.journal-wrap aside .category nav ul li {}
.journal-wrap aside .category nav ul li a { transition: background-color 0.4s,border-color 0.4s; display: block; text-decoration: none; color: #393472; padding: 10px 20px; position: relative; }
.journal-wrap aside .category nav ul li:not(:last-of-type) a { border-bottom: 1px solid #665EC0; }
.journal-wrap aside .category nav ul li a::before { content: ''; }
.journal-wrap aside .category nav ul li a:hover { background: #F0EAF5; }
.journal-wrap aside .back-number ul li a { display: block; background: #F7F6FC; text-decoration: none; color: inherit; padding: 20px; }
.journal-wrap aside .back-number ul li a .sub-title { font-size: 1.5rem; letter-spacing: 0; padding: 0 0 0 10px; }
.journal-wrap aside .category-wrap { display: -webkit-box; display: flex; flex-wrap: wrap; gap: 10px 0; }
    
@media (min-width: 768px) {
    #journal.index .journal-wrap .journal-contents article > div { width: calc(100% - 50% - 40px); padding-right: 30px; }
    #journal.index .journal-wrap .journal-contents article > figure { width: 50%; }
    #journal.index .journal-wrap .journal-contents article > figure a { transition: opacity 0.4s; }
    #journal.index .journal-wrap .journal-contents article > figure a:hover { opacity: 0.8; }
    #journal.index .journal-wrap .journal-contents article > div .btn-c a { width: 205px; }
    #journal.index .journal-wrap .journal-contents article .title a { text-decoration: none; color: #1E2F35; transition: color 0.4s; }
    #journal.index .journal-wrap .journal-contents article .title a:hover { color: #6FB5CC; }

    .journal-wrap aside .back-number ul li a { transition: all 0.4s; }
    .journal-wrap aside .back-number ul li a:hover { opacity: 0.8; }

    .journal-wrap .sub-title { font-size: 2.4rem; padding: 6px 0 6px 10px; margin-bottom: 20px; }
    .journal-wrap .journal-contents { width: calc(100% - 260px - 40px); }
    .journal-wrap .journal-contents article .title { font-size: 2.4rem; }
    .journal-wrap aside { width: 260px; }
}

@media (max-width: 767px) {
    #journal.index #page-title { background: url(/campusview/journal/images/st_pagetitle_sp.jpg) no-repeat center / cover; }

    #journal.index .journal-wrap .journal-contents article > div .btn-c a { width: 100%; }
    .journal-wrap .sub-title { font-size: 1.8rem; margin-bottom: 10px; }
    .journal-wrap .journal-contents article .title { font-size: 2.0rem; }

    .journal-wrap aside .back-number ul { }
    .journal-wrap aside .back-number ul li a .l_col-2-sp { display: -webkit-box; display: flex; }
    .journal-wrap aside .back-number ul li a .l_col-2-sp > * { width: calc(50% - 10px); }
}


/*------------------------------------------------------

	single

------------------------------------------------------*/
#journal.single {}
#journal.single .journal-contents .post-contents figure.single { max-width: 780px; margin-left: auto; margin-right: auto; }

#journal.single #page-title.noimg { background: none; margin: 0; background: #F7F6FC; height: 80px; min-height: auto; padding: 0; }
#journal.single #page-title.noimg .title-wrap { padding: 0; position: static; transform: none; width: 100%; }
#journal.single #page-title.noimg .title-wrap > h1 { background: none; display: block; text-align: center; padding: 0; margin: 0; width: 100%; line-height: 80px; }
#journal.single #page-title.noimg .title-wrap > h1 span { font-size: 2.4rem; background: none; font-weight: bold; display: inline; -webkit-text-fill-color: unset; color: #665EC0; }

#journal.single .journal-contents .post-contents h3 { color: #393472; font-size: 2.4rem; margin-bottom: 20px;}
#journal.single .journal-contents .post-contents h4 { color: #000; font-size: 2rem; margin-bottom: 5px;}
#journal.single .journal-contents .post-contents h5 { color: #393472; font-size: 1.6rem; margin-bottom: 5px;}

.btn-e {}
.btn-e a { display: block; text-decoration: none; background: #F7F6FC; text-align: center; color: #665EC0; font-weight: bold; font-size: 1.8rem; max-width: 260px; margin: 0 auto; padding: 16px 10px; position: relative; }
.btn-e a::before { transition: all 0.2s; content: ''; position: absolute; top: 50%; left: 10px; width: 20px; height: 20px; transform: translateY(-50%); background: #4B43A7; }
.btn-e a::after { content: ''; position: absolute; top: 50%; left: 18px; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: translateY(-50%) rotate(-135deg); }

@media (min-width: 768px) {
    #journal.single .gloval-nav { display: none; }

    #journal.single .journal-contents .post-contents h3 {}
    #journal.single .journal-contents .post-contents h4 {}
    #journal.single .journal-contents .post-contents h5 {}
}

@media (max-width: 767px) {
    .btn-e { margin-bottom: 50px; }

    #journal.single .journal-contents .post-contents h3 {}
    #journal.single .journal-contents .post-contents h4 {}
    #journal.single .journal-contents .post-contents h5 {}
}



/*------------------------------------------------------

    paging

------------------------------------------------------*/
.paging{
	margin: 50px 0 0 0;
	text-align: center;
}
.paging a{
	height: 30px;
	min-width: 30px;
	display: inline-block;
	background: #d3d3d4;
	border-radius: 5px;
	text-align: center;
	padding: 0 10px;
	margin: 0 5px;
	text-decoration: none;
    color: #665EC0;
    line-height: 30px;
}
.paging a.active, .paging a:hover{
	background: #665EC0;
    color: #fff;
}

@media (min-width: 768px) {

}

@media (max-width: 767px) {
    .paging{ margin-bottom: 60px;}
}