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

	.CtsMainBox {
		margin: auto;
	}
	.sp {
		display: block;
	}
	.md {
		display: none;
	}
	img {
		width: 100%;
	}

	.title_section {
		position: relative;
	}

	.title_section:after {
		content: '';
		display: block;
		clear: both;
	}

	.title_section .trapics_logo {
		width: 11.25%;
		position: absolute;
		top: 15%;
		left: 0.2%;
		background-color: #fff;
	}

/*タイトル枠ここから*/
/*前月*/
	.title_section .trapics {
		float: left;
		width: 79.84%;
		background-color: #8bd2d8;
		padding: 3.35% 7.8125% 3.35% 15.93%;
		box-sizing: border-box;
	}
/*最新*/
.title_section .trapics.new {
		float: left;
		width: 79.84%;
		background-color: #772587;
		padding: 3.35% 7.8125% 3.35% 15.93%;
		box-sizing: border-box;
	}
/*タイトル枠ここまで*/

	.title_section .trapics .sp {
		width: 98.3%;
		margin: auto;
	}

	.title_section .date {
		float: left;
		width: 19.5%;
		margin-left: 0.66%;
		text-align: center;
	}
	.title_section .year {
		color: #333;
		font-size: 4vw;;
		line-height: 5vw;
		font-weight: bold;
		margin-top: 1.5vw;
	}
	.title_section .month {
		color: #333;
		font-size: 5vw;
		line-height: 6vw;
		font-weight: bold;
	}
	.title_section .category {
		background-color: #f61c3b;
		padding: 2vw 1vw;
		margin-top: 0.75vw;
		display: flex;
	}

	.desc {
		margin: 3.125% 0 5%;
		text-align: right;
	}
	.desc a {
		display: inline-block;
		width: 53.59375%;
		margin-top: 4px;
	}

	.course .title {
		display: inline-block;
		width: 89.06%;
		padding: 8.5% 0 0;
		position: relative;
		background-color: #f65ab6;
	}

	.course .title img {
		position: absolute;
		width: 68.245%;
		top: 22%;
		left: 2.98%;
	}
	.course .title:after {
		content: '';
		position: absolute;
		left: 100%;
		top: 0;
		width: 8.77%;
		height: 100%;
		background: url("/attending/t/tyo-d/dm_bus_jr/images/posted_ttl.png") no-repeat top left;
		background-size: contain;
	}

	.course .frame {
		border: 0.5vw solid #f65ab6;
		padding: 0 2% 2.5% 2%;
	}
	.course .frame li, .tab-content li {
		border-bottom: 0.5vw dotted #333;
		margin-top: 1.5%;
		overflow:hidden;
	}
	.course .frame li a, .tab-content li a {
		color: #0066cc;
		font-size: 4.1vw;
		font-weight: bold;
		line-height: 5vw;
	}

	.course .frame li dl dd, .tab-content li dl dd {
		display: block;
		text-align: right;
		color: #772587;
		font-size: 5vw;
		font-weight: bold;
		line-height: 8vw;
	}
	.course .frame li dl dd.phot, .tab-content li dl dd.phot {
		float:left;
		margin-right:2%;
		margin-bottom:2%;
		width:35%;
	}

	.course_tabs {
		margin: 3.125% 0 6.25%;
	}

	.tabs:after {
		content: '';
		display: block;
		clear: both;
	}
	.tabs li {
		float: left;
		margin-top: 1.5625%;
		border-radius: 3.5vw 3.5vw 0 0;
		padding-top: 7.8125%;
		position: relative;
		background: url("/attending/t/tyo-d/dm_bus_jr/images/tabs_icon.png") no-repeat top 50% right 9.54%;
		cursor: pointer;
	}
	.tabs li img {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}

	.tabs li.active {
		margin-top: 0;
		padding-top: 9.375%;
		background-image: none;
		cursor: default;
	}
	.tabs li[data-tab="1"] {
		background-color: #f61c3b;
		width: 50%;
	}

	.tabs li[data-tab="1"] img {
		width: 65.454545%;
	}
	.tabs li[data-tab="1"]:not(.active) img {
		left: 46%;
	}
	.tabs li[data-tab="2"] {
		background-color: #263fd6;
		width: 50%;
	}
	.tabs li[data-tab="2"] img {
		width: 74.375%;
	}
	.tabs li[data-tab="2"]:not(.active) img {
		left: 46%;
	}

	.tab-content {
		display: none;
		border-style: solid;
		border-width: 2.5vw 1vw;
	}
	.tab-content ul {
		padding: 0 1.5% 3% 1.5%;
	}
	.tab-content[data-tab="1"] {
		border-color: #f61c3b;
	}
	.tab-content[data-tab="2"], .tab-content[data-tab="2"] .select_area {
		border-color: #263fd6;
	}
	.tab-content.active {
		display: block;
	}

	.tab-content .select_area {
		border-bottom: 1vw solid;
		padding: 2%;
	}

	.tab-content .select_area .ttl {
		display: block;
		margin-bottom: 2%;
	}

	.tab-content[data-tab="1"] .select_area .ttl {
		width: 63.122%;
	}

	.tab-content[data-tab="2"] .select_area .ttl {
		width: 68.7%;
	}

	.tab-content .select_style {
		display: inline-block;
		margin: 1% 1% 0 0;
		border: 0.25vw solid #e77d00;
		border-radius: 4vw;
		background: rgba(255,171,69,1);
		background: -moz-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,171,69,1)), color-stop(100%, rgba(255,138,0,1)));
		background: -webkit-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: -o-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: -ms-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: linear-gradient(to bottom, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffab45', endColorstr='#ff8a00', GradientType=0 );
		position: relative;
		overflow: hidden;
		padding-left: 2vw;
		padding-right:7vw;
		padding-top: 1vw;
		padding-bottom: 1vw;
		/*box-sizing: border-box;*/
		height: 6vw;
		line-height: 6.5vw;
		font-size: 4.5vw;
	}

	/*.tab-content[data-tab="1"] .select_style.select01 {
		width: 33.5vw;
	}

	.tab-content[data-tab="1"] .select_style.select02 {
		width: 29.7vw;
		margin-right: 30%;
	}

	.tab-content[data-tab="2"] .select_style.select01 {
		width: 27.2vw;
	}

	.tab-content[data-tab="2"] .select_style.select02 {
		width: 28.5vw;
	}*/


	.tab-content .select_style:after {
		content: '';
		position: absolute;
		background: url("/attending/t/tyo-d/dm_bus_jr/images/tabs_dropdown.png") no-repeat top left;
		background-size: contain;
		width: 2.7vw;
		height: 2vw;
		top: 3vw;
		right: 3vw;
	}

	.tab-content .results .area {
		display: block;
		text-align: center;
		margin: 2% 1% 4%;
		background-color: #f6a11c;
		color: #231815;
		font-size: 5vw;
		height: 9vw;
		line-height: 9vw;
		position: relative;
	}
	.tab-content .results .area:after {
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		margin-left: -3vw;
		border-style: solid;
		border-width: 3vw 3vw 0 3vw;
		border-color: #f6a11c transparent transparent transparent;
	}
	.tab-content .results .area span {
		font-size: 3vw;
	}

	.select-results:not(.visible) {
		display: none;
	}

	.section_links a {
		width: 73.75%;
		display: block;
		margin: auto;
	}

	.section_links a+a {
		margin-top: 3.125%
	}

	.bottom_links {
		margin: 16.4% 0 5%;
	}

	.bottom_links .link:not(.md) {
		display: block;
	}

	.bottom_links .link img {
		width: 28.125%;
		padding: 0 1.5625%;
		box-sizing: border-box;
	}
	.bottom_links .link span {
		display: inline-block;
		width: 70%;
		box-sizing: border-box;
		vertical-align: top;
		font-size: 4.4vw;
		line-height: 7vw;
		padding-top: 2.34375%;
	}

	.bottom_links .link+.link {
		margin-top: 2.34375%;
	}

	.bottom_links .link+.link span {
		padding: 3.1255% 5% 0 0;
	}
}



@media screen and (min-width: 769px) {

	:where(.CtsMrBox) img {
  		width: auto;
	}
	
	.sp {
		display: none;
	}
	
	.contents {
		max-width: 960px;
		margin: auto;
	}
	
	/*.title_section .trapics_logo {
		vertical-align: top;
		margin: 3px 3px 0 0;
	}*/
	
	.title_section {
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
	
	.title_section img.trapics_logo {
		width: auto;
	}
	
	.title_section img {
		width: 100%;
	}
	
	/*前月号のタイトル枠*/
	.title_section .trapics {
		display: inline-block;
		vertical-align: top;
		background-color: #8bd2d8;
		padding: 35px 67px 40px 64px;
		margin: 0 1%;
	}
	
	/*最新号のタイトル枠*/
	.title_section .trapics.new {
		display: inline-block;
		vertical-align: top;
		background-color: #772587;
		padding: 35px 67px 40px 64px;
		margin: 0 1%;
	}
	.title_section .date {
		min-width: 152px;
		display: inline-block;
		vertical-align: top;
		text-align: center;
	}
	.title_section .year {
		color: #333;
		font-size: 24px;
		line-height: 1.0;
		font-weight: bold;
		margin-top: 24px;
	}
	.title_section .month {
		color: #333;
		font-size: 22px;
		line-height: 55px;
		font-weight: bold;
	}
	.desc {
		margin: 28px 0 45px;
	}
	.desc a {
		float: right;
		margin-top: 4px;
	}
	.desc p {
		/*max-width: 695px;*/
		color: #333;
		font-size: 16px;
	}

	.course {
		padding: 0 10px;
	}

	.course .title {
		display: inline-block;
		padding: 10px 165px 0px 18px;
		height: 52px;
		box-sizing: border-box;
		position: relative;
		background-color: #f65ab6;
	}
	.course .title:after {
		content: '';
		position: absolute;
		left: 100%;
		top: 0;
		border-style: solid;
		border-width: 52px 0 0 52px;
		border-color: transparent transparent transparent #f65ab6;
	}
	.course .frame {
		border: 2px solid #f65ab6;
		padding: 0 5px 6px 8px;
	}
	.course .frame li, .tab-content li {
		border-bottom: 1px dotted #333;
		margin: 8px;
		padding-bottom: 8px;
		overflow: hidden;
		height: 131px;
		width: 907px;
		position: relative;
	}
	.course .frame li dl dt, .tab-content li dl dt {
		width:79%;
		margin-top:5px;
		position:absolute;
		top:0;
		left:190px;
	}
	.course .frame li a, .tab-content li a {
		color: #0066cc;
		font-size: 21px;
		font-weight: bold;
		line-height: 31px;
		letter-spacing: 2px;
	}
	
	.course .frame li dl dd.phot, .tab-content li dl dd.phot {
		margin-right:20px;
		width:175px;
		height:131px;
		overflow:hidden;
		position:absolute;
		top:0;
		left:0;
	}
	
	.course .frame li dl dd.phot img, .tab-content li dl dd.phot img {
		width:175px;
		height: auto;
	}
	
	.course .frame li dl dd, .tab-content li dl dd {
		float: right;
		color: #772587;
		font-size: 24px;
		font-weight: bold;
		line-height: 25px;
		position: absolute;
		bottom: 15px;
right: 0;
	}

	.course_tabs {
		padding: 0 10px;
		margin: 20px 0 40px;
	}

	.tabs:after {
		content: '';
		display: block;
		clear: both;
	}
	.tabs li {
		float: left;
		height: 45px;
		margin-top: 15px;
		border-radius: 12px 12px 0 0;
		position: relative;
		background: url("/attending/t/tyo-d/dm_bus_jr/images/tabs_icon.png") no-repeat top 17px right 17px;
		cursor: pointer;
	}
	.tabs li img {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}

	.tabs li.active {
		height: 60px;
		margin-top: 0;
		background-image: none;
		cursor: default;
	}
	.tabs li[data-tab="1"] {
		background-color: #f61c3b;
		width: 50%;
	}
	.tabs li[data-tab="2"] {
		background-color: #263fd6;
		width: 50%;
	}

	.tab-content {
		display: none;
		border: 5px solid;
	}
	.tab-content ul {
		padding: 0 2px 6px 5px;
	}

	.tab-content[data-tab="1"], .tab-content[data-tab="1"] .select_area {
		border-color: #f61c3b;
	}
	.tab-content[data-tab="2"], .tab-content[data-tab="2"] .select_area {
		border-color: #263fd6;
	}
	.tab-content.active {
		display: block;
	}

	.tab-content .select_area {
		border-bottom: 5px solid;
		padding: 14px 0 40px 15px;
	}

	.tab-content .select_area .ttl {
		display: block;
	}

	.tab-content .select_style {
		display: inline-block;
		margin: 12px 10px 0 0;
		border: 1px solid #e77d00;
		border-radius: 20px;
		background: rgba(255,171,69,1);
		background: -moz-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,171,69,1)), color-stop(100%, rgba(255,138,0,1)));
		background: -webkit-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: -o-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: -ms-linear-gradient(top, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		background: linear-gradient(to bottom, rgba(255,171,69,1) 0%, rgba(255,138,0,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffab45', endColorstr='#ff8a00', GradientType=0 );
		position: relative;
		overflow: hidden;
		cursor: pointer;
		padding-left: 18px;
		padding-right: 40px;
		box-sizing: border-box;
		height: 33px;
		line-height: 33px;
		font-size: 16px;
	}

	/*.tab-content[data-tab="1"] .select_style.select01 {
		width: 142px;
	}

	.tab-content[data-tab="1"] .select_style.select02 {
		width: 127px;
	}

	.tab-content[data-tab="2"] .select_style.select01 {
		width: 134px;
	}

	.tab-content[data-tab="2"] .select_style.select02 {
		width: 145px;
	}*/


	.tab-content .select_style:after {
		content: '';
		position: absolute;
		background: url("/attending/t/tyo-d/dm_bus_jr/images/tabs_dropdown.png") no-repeat top left;
		width: 10px;
		height: 8px;
		top: 12px;
		right: 20px;
	}

	.tab-content .results .area {
		display: inline-block;
		text-align: center;
		width: 425px;
		margin: 10px 0 18px 16px;
		background-color: #f6a11c;
		color: #231815;
		font-size: 24px;
		height: 45px;
		line-height: 45px;
		position: relative;
	}
	.tab-content .results .area:after {
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		margin-left: -15px;
		border-style: solid;
		border-width: 15px 15px 0 15px;
		border-color: #f6a11c transparent transparent transparent;
	}
	.tab-content .results .area span {
		font-size: 14px;
	}

	.tab-content .results .number {
		display: inline-block;
		vertical-align: bottom;
		margin: 0 0 22px 10px;
		font-size: 16px;
	}
	.tab-content .results .number span {
		color: #772587;
		font-size:16px;
	}

	.select-results:not(.visible) {
		display: none;
	}

	.section_links {
		padding-bottom: 39px;
		border-bottom: 1px solid #bbb;
		display: flex;
	}
	
	.section_links a {
		margin: 0 5px;
	}

	.section_links a img {
		width: 100%;
	}
	.bottom_links {
		text-align: center;
		padding-top: 30px;
		margin-bottom: 40px;
	}
	.bottom_links .link:not(.sp) {
		width: 310px;
		display: inline-block;
		text-align: center;
		vertical-align: middle;
	}

	.bottom_links .link img {
		vertical-align: middle;
		margin-right: 8px;
	}
	.bottom_links .link span {
		display: inline-block;
		vertical-align: middle;
		text-align: left;
		font-size: 14px;
		line-height: 26px;
	}
}
/*start_リニューアル2021対応*/
:where(.CtsMrBox) *,
:where(.CtsMrBox)::after,
:where(.CtsMrBox)::before {
  box-sizing: content-box;
}

.md.cover {
	width: 110px;
    min-width: 80px;
}