@charset "utf-8";
/*--------------------------------------
	copyright :　webcal
--------------------------------------*/

@import url(normalize.css);
@import url(common_parts.css);
@import url(common.css);


/*　project　==============================*/


/* mv ----------*/
#mv { position: relative; }
#mv h1 { position: absolute; top: 50%; left: 50%; font-size: 2.3rem; color: #fff; transform: translate(-50%, -50%); }
#mv img { width: 100%; }

/* main  ----------*/
.change_tag { margin: 2rem 1.5rem 1.50rem; border-bottom: 5px solid #0080DE; }
.change_tag .flb { display: flex; }
.change_tag .flb li { cursor: pointer; width: 50%; background: #BFC9D5; font-size: 8px; text-align: center; color: #fff; font-weight: bold; }
.change_tag .flb li a { color: #fff; display: block; padding: 0.7rem 0; }
.change_tag .flb li.disp_on { background: #17597C; border-top-right-radius: 20px; }
#project .sec_inner { margin: 0 1rem 2.5rem; }
#project .page_header { margin: 0 2.5rem 2rem; }
#project .project_list { margin: 4rem  6rem 8rem; }
#project .project_list ul li { margin-bottom: 4rem; text-align: center; }
#project .project_list ul li a { font-size: 18px; color: #000; font-weight: bold; }
#slider_cont { margin-bottom: 4rem; position: relative; }
#slider_cont .slick-slide { margin: 0 2.3rem; }
#slider_cont p { font-size: 1.3rem; margin: 0; font-weight: bold; }
#slider_cont a { color: #000; }


@media screen and ( min-width: 769px ) {
	.change_tag { margin: 8rem 0 5.2vw; }
	.change_tag .flb li { cursor: pointer; width: 50%; background: #BFC9D5; font-size: 2.1vw; text-align: center; color: #fff; font-weight: bold; }
	.change_tag .flb li.disp_on { background: #17597C; border-top-right-radius: 3.7vw; }
	.change_tag .flb li a { padding: 1.465vw; }
/*	#mv h1 { left: 9.65vw; font-size: 7.5rem; transform: translateY(-50%); }*/
	#mv h1 { left: 9.65vw; font-size: 3.8vw; transform: translateY(-50%); }
	#project .sec_inner { margin: 0 3.15vw 17.7vw; }
	#project #project_nav { margin-top: -9rem; padding-top: 9rem; }
	#project .page_header { margin: 0 0 4.2vw; }
	#project .project_list { margin: 2.7vw 3.15vw 4vw; }
	#project .project_list ul { display: flex; flex-wrap: wrap; }
	#project .project_list ul li:not(:nth-of-type(2n)) { margin-right: 0; }
	#project .project_list ul li:not(:nth-of-type(4n)) { margin-right: 2.6vw; }
	#project .project_list ul li { margin-bottom: 4rem; width: calc( (100% - 7.8vw) / 4 ) }
	#project .project_list ul li p { margin: 0; font-size: 1.25vw; }
	#project .project_list ul li a { font-size: 2.4rem; }
	#slider_cont { margin: 0 1rem 10rem; padding: 0 8rem; }
	#slider_cont .flb { display: flex; }
	#slider_cont p { font-size: 0.95vw; margin: 0; }
	#slider_cont a { color: #000; }
	#slider_cont .slick-slide{ margin: 0 1.75vw 0; }
	#slider_cont .slide-items .slick-arrow { width: 60px; height: 60px; border-radius: 50%; cursor: pointer; border: none; outline: none; font-size: 0; position: absolute; top: 180px; z-index: 1; filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16)); }
	#slider_cont .slide-items .slick-arrow::before { content: ''; display: block; }
	#slider_cont .slide-items .slick-next { right: -7rem; top: 50%; }
	#slider_cont .slide-items .slick-prev { left: -4rem; top: 50%; }
	#slider_cont .slide-items .slick-next::before { left: 20px; width: 0; height: 0; border-style: solid; border-width: 22px 0 22px 32px; border-color: transparent transparent transparent #1E3553; }
	#slider_cont .slide-items .slick-prev::before { /*right:*/ 8rem; width: 0; height: 0; border-style: solid; border-width: 22px 32px 22px 0; border-color: transparent #1E3553 transparent transparent; position: absolute; top: 50%; transform: translateY(-50%); }
	#slider_cont .slick-prev:before, #slider_cont .slick-next:before { opacity: 1; }
	#slider_cont .slide-items button { transform: translateY(-50%); }
}


/* project_single */
#project_single .sec_inner { margin: 0 1rem 2.5rem ; }
#project_single .change_tag { border-bottom: 5px solid #0080DE; }
#project_single .change_tag a { color: #fff; }
#project_single .page_header { margin: 0 2.5rem 2rem; }
#project_single .img_box { text-align: center; margin-bottom: 4rem; }
#project_single .text_box h2 { font-size: 1.7rem; background: #17597C; color: #fff; padding: 2rem 0; text-align: center; font-family: "A1明朝","A1 Mincho"; margin-bottom: 2rem; }
#project_single .text_box .card { padding: 4rem; position: relative; }
#project_single .text_box .card::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 0 0 73.81px 55.75px; border-color: transparent transparent #17597C transparent; margin-left: auto; }
#project_single .text_box .card h3 { border-bottom: 3px solid #6E9F82; font-size: 2.4rem; margin-bottom: 4rem; }
#project_single .text_box .card p { font-size: 1.8rem; font-weight: bold; margin: 0; line-height: 3; }
#project_single .page_link { justify-content: center; margin-top: 4rem; display: flex; }
#project_single .page_link li { font-size: 1.8rem; font-weight: bold; }
#project_single .page_link li:nth-of-type(1) { margin-right: 10rem; }
#project_single .page_link li a { color: #000; }
#project_single .connection { background: #BFC9D5; padding: 4rem 7rem; }
#project_single .connection h3 { font-size: 1.8rem; color: #2E2E2B; font-family: "Noto Sans Myanmar"; margin-bottom: 4rem; }
#project_single .connection .project_list li { margin-bottom: 4rem; }
#project_single .connection .project_list li p { font-size: 1.8rem; font-weight: bold; }
#project_single .connection .project_list li a { color: #000; }

@media screen and ( min-width: 769px ) {
	#project_single .sec_inner { margin: 0 3.15vw 17.7vw; }
	#project_single .change_tag { border-bottom: 5px solid #6E9F82; }
	#project_single .flb { display: flex; }
	#project_single .img_box { width: 50%; margin-right: 6.25vw; text-align: left; margin-bottom: 0; }
	#project_single .img_box img { width: 100%; }
	#project_single .page_header { margin: 0 0 4.2vw; }
	#project_single .text_box h2 { font-size: 1.67vw; padding: 1.05vw 0; max-width: 623px; margin-bottom: 0; }
	#project_single .text_box .card { padding: 2.6vw; max-width: 717px; }
	#project_single .text_box .card::after { content: none; }
	#project_single .text_box .card h3 { border-bottom: 3px solid #6E9F82; font-size: 2.1vw; margin-bottom: 0; }
	#project_single .text_box .card p { font-size: 1.25vw; font-weight: bold; }
	#project_single .page_link { justify-content: center; margin-top: 10rem;}
	#project_single .page_link li { font-size: 1.85vw; font-weight: bold; }
	#project_single .page_link li:nth-of-type(1) { margin-right: 15.65vw; }
	#project_single .page_link li:not(.link_btn):hover { color: #808080; }
	#project_single .connection { background: #BFC9D5; padding: 4.3vw 3.1vw 3.1vw; }
	#project_single .connection h3 { font-size: 2.35vw; color: #2E2E2B; font-family: "Noto Sans Myanmar"; margin-bottom: 2.15vw; }
	#project_single .connection .project_list li { margin-bottom: 0; width: calc( (100% - 7.2vw) / 3 ); }
	#project_single .connection .project_list li:not(:nth-last-of-type(1)) { margin-right: 2.6vw; }	
	#project_single .connection .project_list li p { font-size: 1.25vw; }
	#project_single .connection .project_list a { color: #000; }
}

@media screen and ( min-width: 769px ) {
	#main .inner { width: 80%; margin: auto; }
}