@charset "UTF-8";

/* reset */

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; box-sizing: border-box; }

article, aside, figure, footer, header, hgroup, nav, section { display: block; }

img, object, embed { max-width: 100%; }

html { overflow-y: scroll; }

ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted #000; cursor: help; }

table { border-collapse: collapse; border-spacing: 0; }

th { font-weight: bold; vertical-align: top; }

td { font-weight: normal; vertical-align: top; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: top; }

pre { white-space: pre; /* CSS2 */ white-space: pre-wrap; /* CSS 2.1 */ white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ }

input[type="radio"] { vertical-align: middle; }

input[type="checkbox"] { vertical-align: middle; *vertical-align: baseline; }

input[type="button"], input[type="submit"] { -webkit-appearance: none; }

select, input, textarea { font: 99% sans-serif; }

table { font-size: inherit; font: 100%; }

a:hover, a:active { outline: none; }

small { font-size: 85%; }

strong, th { font-weight: bold; }

td, td img { vertical-align: top; }

sub, sup { font-size: 75%; line-height: 0; position: relative; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

pre, code, kbd, samp { font-family: monospace, sans-serif; }

.clickable, label, input[type=button], input[type=submit], button { cursor: pointer; font-size: 90%; }

button, input, select, textarea { margin: 0; }

button { width: auto; overflow: visible; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; }

img { vertical-align: bottom; }

em { font-style: normal; }

html { box-sizing: border-box; font-size: 62.5%; }

*, *::before, *::after { box-sizing: inherit; }

body, select, input, textarea { font-size: 100% !important; -webkit-text-size-adjust: none; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; }

a { color: #005ab4; text-decoration: none; -webkit-tap-highlight-color: rgba(0, 0, 255, 0.2) !important; }

a:hover { color: #005AB4; text-decoration: underline; }

@media only screen and (min-width: 768px) { a[href^="tel:"] { pointer-events: none; } }

caption { margin-bottom: 5px; text-align: left; }

ins { background-color: #fcd700; color: #333; text-decoration: none; }

mark { background-color: #fcd700; color: #333; font-style: italic; font-weight: bold; }

select { height: 1.8em; }

input { padding: 0 2px; border-radius: 0; }

textarea { padding: 2px; resize: vertical; width: 98%; }

button { background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; }


/*=================================================================== Contents Font ===================================================================*/
.headerLogo, .header_inner, .local_navi, #contents, .category_footer { font-family: 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; }

.headerLogo body, .headerLogo select, .headerLogo input, .headerLogo textarea, .headerLogo button, .header_inner body, .header_inner select, .header_inner input, .header_inner textarea, .header_inner button, .local_navi body, .local_navi select, .local_navi input, .local_navi textarea, .local_navi button, #contents body, #contents select, #contents input, #contents textarea, #contents button, .category_footer body, .category_footer select, .category_footer input, .category_footer textarea, .category_footer button { font-family: 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; }

/*=================================================================== lazyload ===================================================================*/
img.lazy { min-width: 10px; -webkit-transition: opacity 1s; transition: opacity 1s; }

img.lazy:not(.active) { opacity: 0; }

/*=================================================================== anchor link ===================================================================*/
html { scroll-padding-top: 100px; }

/*=================================================================== header ===================================================================*/
#header #headNav .serch p > * { position: relative; top: -1px; }

#header #headNav .serch p input { font-size: 10px !important; }

#header #headNav .serch p .img { letter-spacing: 0; }

#header #headNav .serch p .img input[type="image"] { padding-right: 0; box-sizing: content-box; }

#header #headNav .serch p .txt, #header #headNav .serch p .img_tbl_1 figure figcaption, .img_tbl_1 figure #header #headNav .serch p figcaption { font-size: 14px; }

#header .header_inner { max-width: calc(1210px + 30px); margin: 15px auto 0; padding: 0 15px; }

@media only screen and (max-width: 767px) { #header .header_inner { width: auto; } }

@media only screen and (max-width: 767px) { #header #headNav .serch form input[type="text"] { font-size: 16px !important; }
  #header #headNav .serch p span.img { position: static !important; } }

/*=================================================================== contents ===================================================================*/
#contents { min-width: auto; }

@media only screen and (max-width: 767px) { #contents { padding: 0; } }

@media only screen and (max-width: 767px) { #contents .container { overflow: hidden; } }

#contents .container > .container_inner { position: relative; width: calc(1210px + 30px); margin: 0 auto; padding: 0 15px; }

@media only screen and (max-width: 767px) { #contents .container > .container_inner { width: auto; } }

/*=================================================================== footer ===================================================================*/
#footer { position: relative; margin-top: 0 !important; }

@media print, screen and (min-width: 768px) { #footer { min-width: 1240px; } }

#footer #pagetopBlock { display: block; }

@media only screen and (max-width: 767px) { #footer #pagetopBlock { bottom: 5px !important; right: 5px !important; }
  #footer #pagetopBlock > p { padding: 11px 15px; }
  #footer #pagetopBlock > p img { width: 40px; height: 40px; } }



/* other
* ------------------------- */
.pc {
  display: block  !important;
}

.sp {
  display: none !important;
}

@media screen and (max-width: 812px) {
  .pc {
    display: none !important;
  }

  .sp {
    display: block  !important;
  }
}
button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  appearance: none;
}

input, button, select, textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
}

/*/////////////////////////////
EPSON
/////////////////////////////*/
/* font_base
* ------------------------- */
.fontNotoJP {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600;
  letter-spacing: 0.05em;
}

@media screen and (min-width: 768px) {
	#contents {
		min-width: 1240px;
	}
}

#contents .headSection .purchase a:hover img {
	visibility: visible;
}
#contents .headSection .ttl h1 {
	font-size: 2.2rem;
	font-weight: bold;
	padding: 0;
	background: none;
}
#contents .headSection .ttl a {
	color: #000 !important;
}
#contents .headSection .ttl p {
	font-size: 2.2rem;
	font-weight: bold;
	padding: 0;
	margin-bottom: 0;
}
#contents .headSection .ttl p.productsLogo {
	padding: 0;
	margin: 0;
}
@media screen and (min-width: 768px) {
	#contents .headSection .innerBlock {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 1240px;
		padding: 0 15px;
	}
	#contents .headSection .ttl {
		float: none;
		width: auto;
		display: flex;
		align-items: center;
	}
	#contents .headSection .ttl p.productsLogo {
		margin: 0;
		margin-right: 12px;
	}
	#contents .headSection .aside {
		padding-top: 0;
	}
	#contents .headSection .aside .guide {
		display: flex;
		justify-content: flex-end;
	}
	#contents .headSection .aside .guide ul {
		display: flex;
	}
}
@media screen and (max-width: 767px) {
	#contents .headSection {
		margin: 3.4% auto 3.4%;
	}
	#contents .headSection .leftArea {
		float: none;
		width: auto;
	}
	#contents .headSection .innerBlock {
		width: auto;
	}
	#contents .headSection .aside {
		float: none;
		width: auto;
		padding-top: 18px;
		text-align: center;
	}
	#contents .headSection .aside .guide {
		float: none;
		width: auto;
		padding: 0;
		margin: 5.3% auto 0;
		float: none;
		width: auto;
	}
	#contents .headSection .aside .guide ul {
		text-align: center;
		display: flex;
		justify-content: center;
	}
	#contents .headSection .aside .guide li {
		display: inline-block;
		vertical-align: bottom;
		padding: 0 4px;
		letter-spacing: 0;
		width: 40%;
	}
	#contents .headSection .aside .guide li a {
		display: block;
		width: 100%;
		height: 100%;
	}
	#contents .headSection .aside .guide li a img {
		width: 100%;
		height: auto;
	}
	#contents .headSection .ttl {
		float: none;
		display: block;
		width: 93.3vw;
		margin: 0 auto;
		font-weight: bold;
	}
	#contents .headSection .ttl p {
		width: 100%;
		text-align: center;
	}
	#contents .headSection .ttl h1 {
		width: 100%;
		font-family: sans-serif;
		margin-top: 0;
		padding: 0;
		text-align: center;
		background: none !important;
font-size: 20px;
	}
}



/*page_navi_area*/

#page_navi_area {
	background-color: #000;
border-bottom: 3px solid #dd0008;
	height: 70px;
	width: 100%;
	min-width: 980px;
	position: absolute;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	position: sticky;
	top: 0;
	z-index: 5;
}

@media screen and (max-width: 767px) {
	#page_navi_area {
		justify-content: space-between;
		min-width: auto;
height: 42px;
border-bottom: 2px solid #dd0008;
	}
}

#page_navi_area.fixed {
	position: fixed;
	z-index: 10;
}

	#page_navi_area ul#page_navi {
		display: flex;
justify-content: space-between;
		align-items: center;
flex-wrap: wrap;
min-width: 1000px;
	}

	#page_navi_area ul#page_navi li {
width: 25%;
border-left: 1px solid #666;
	}

	#page_navi_area ul#page_navi li:last-child {
border-right: 1px solid #666;
	}

@media screen and (max-width: 767px) {
	#page_navi_area ul#page_navi {
min-width: 100%;
	}

	#page_navi_area ul#page_navi li {
width: 23%;
	}
	#page_navi_area ul#page_navi li:first-child {
border-left: none;
	}
	#page_navi_area ul#page_navi li:last-child {
width: 31%;
border-right: none;
	}
}


#page_navi_area ul#page_navi a {
	display: block;
	width: 100%;
	height: 50px;
	font-size: 1.7rem;
font-weight: 600;
line-height: 40px;
	color: #fff;
	text-decoration: none;
position: relative;
text-align: center;
}

#page_navi_area ul#page_navi a:before,
#page_navi_area ul#page_navi a:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: calc(50% - 0.5px);
  width: 1px;
  height: 10px;
  border-radius: 9999px;
  background-color: #ffffff;
  transform-origin: 50% calc(100% - 0.5px);
}

#page_navi_area ul#page_navi a:before {
  transform: rotate(45deg);
}

#page_navi_area ul#page_navi a:after {
  transform: rotate(-45deg);
}

@media screen and (max-width: 767px) {
#page_navi_area ul#page_navi a {
height: 40px;
font-size: 10px;
}

#page_navi_area ul#page_navi a:before,
#page_navi_area ul#page_navi a:after {
height: 5px;
bottom: 5px;
}

}


	#page_navi_area ul#page_navi a {
		transition: opacity 0.3s linear;
	}
	#page_navi_area ul#page_navi a:hover {
		opacity: 0.6;
	}

@media screen and (max-width: 767px) {
	#page_navi_area .btnBuy {
		margin: 0 0 0 10vw;
	}
}

.detailSection {
	font-size: 1.4rem;
}

body, select, input, textarea {
	font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
}

p {
	line-height: 1.75;
}

#contents {
	font-size: 1.5rem;
	line-height: 1.75;
}
@media screen and (max-width: 767px) {
	#contents {
		font-size: 1.3rem;
	}
}


/*mainVisual*/

.mainVisual {
  position: relative;
  width: 100%;
  max-width: 1440px;
  min-width: 1280px;
  margin: 0 auto 40px auto;
  overflow: hidden;
}

@media only screen and (max-width: 812px) {
.mainVisual {
    width: 100%;
    min-width: auto;
    max-width: auto;
  }
}


#reliability{
width: 100%;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
}

#reliability .inner{
width: 100%;
max-width: 1240px;
margin: 0 auto;
}

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

#reliability .inner{
width: 96%;
max-width: 96%;
margin: 0 auto;
}

}


/*title*/

#reliability h2.sectionTitle{
width: 100%;
height: 200px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
margin: 0 0;
padding: 0 0;
font-size: 30px;
font-weight: 600;
background-image: url(../images/title-bg.jpg);
background-repeat: no-repeat;
background-size: contain;
background-position: top left;
}

#reliability h2.sectionTitle span{
display: block;
width: 100%;
text-align: center;
font-size: 15px;
color: #dd0008;
}

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

#reliability h2.sectionTitle{
height: 100px;
font-size: 22px;
font-weight: 600;
background-size: contain;
}

#reliability h2.sectionTitle span{
font-size: 13px;
}

}


.testList{
width: 100%;
}

.testList ol{
width: 100%;
list-style: none;
margin: 0 0;
padding: 0 0;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
}

.testList ol li{
width: 16.666%;
border-left: 1px solid #0071bc;
}

.testList ol li:last-child{
border-right: 1px solid #0071bc;
}

.testList ol li a{
width: 100%;
padding: 20px 10px 30px 0;
display: flex;
justify-content: flex-start;
align-items: center;
flex-direction: column;
font-size: 16px;
font-weight: 600;
color: #0071bc;
text-decoration: none;
position: relative;
transition : all 0.5s ease 0s;
}


.testList ol li a:hover{
background-color: #f2f6fb;
}

.testList ol li span.number{
width: 30px;
height: 40px;
background-color: #0071bc;
color: #fff;
clip-path: polygon(0 0, 99% 20%, 100% 80%, 0% 100%);
display: flex;
justify-content: center;
align-items: center;
font-size: 15px;
font-weight: 600;
letter-spacing: 0;
margin: 0 0 10px 0;
}

.testList ol li img{
width: 60%;
}

.testList ol li a:before,
.testList ol li a:after {
  content: "";
  position: absolute;
  bottom: 10px;
  left: calc(50% - 0.5px);
  width: 1px;
  height: 10px;
  border-radius: 9999px;
  background-color: #0071bc;
  transform-origin: 50% calc(100% - 0.5px);
}

.testList ol li a:before {
  transform: rotate(45deg);
}

.testList ol li a:after {
  transform: rotate(-45deg);
}


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

.testList ol{
justify-content: space-between;
}


.testList ol li{
width: 48%;
border-left: none;
border-bottom: 1px solid #0071bc;
margin: 0 0 10px 0;
}

.testList ol li:last-child{
border-right: none;
}


.testList ol li a{
width: 100%;
padding: 5px 0;
font-size: 12px;
flex-direction: row;
}

.testList ol li span.number{
width: 20px;
height: 30px;
font-size: 10px;
margin: 0 5px 0 0;
}

.testList ol li a:before,
.testList ol li a:after {
 height: 7px;
  position: absolute;
  bottom: 17px;
  left: auto;
right: 10px !important;
}

}



.testContents{
width: 100%;
padding: 80px 0;
}


@media screen and (max-width: 767px) {
.testContents{
padding: 40px 0;
}
}


ol.reList{
width: 100%;
list-style: none;
margin: 0 0;
padding: 0 0;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
}

ol.reList li{
width: 100%;
display: flex;
justify-content: space-between;
align-items: stretch;
flex-wrap: wrap;
margin: 0 0 120px 0;
}

ol.reList li:last-child{
margin: 0 0 40px 0;
}

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

ol.reList li{
margin: 0 0 80px 0;
}

ol.reList li:last-child{
margin: 0 0 40px 0;
}

}

ol.reList li .reListImg{
width: 35%;
}

ol.reList li .reListText{
width: 60%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-direction: column;
}

.reListText h3{
width: 100%;
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
font-size: 30px;
font-weight: 600;
letter-spacing: 0.1em;
margin: 0 0 30px 0;
padding: 0 0;
}

.reListText h3 small{
display: block;
font-size: 15px;
font-weight: normal;
letter-spacing: 0;
}

.reListText h3 span.number{
width: 60px;
height: 70px;
background-color: #000;
color: #fff;
clip-path: polygon(0 0, 99% 20%, 100% 80%, 0% 100%);
display: flex;
justify-content: center;
align-items: center;
margin: 0 20px 0 0;
font-size: 20px;
font-weight: 600;
letter-spacing: 0;
}


.reListText p{
width: 100%;
padding: 0 20px;
line-height: 2;
}


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

ol.reList li .reListImg{
width: 80%;
margin: 0 10% 30px 10%;
}

ol.reList li .reListText{
width: 100%;
}

.reListText h3{
font-size: 18px;
letter-spacing: 0;
margin: 0 0 20px 0;
}

.reListText h3 small{
font-size: 12px;
letter-spacing: 0;
}

.reListText h3 span.number{
width: 40px;
height: 50px;
font-size: 17px;
}

.reListText p{
padding: 0 10px;
line-height: 1.8;
}

}



.reDetail{
width: 100%;
}

.reDetail dl {
width: 100%;
position: relative;
top: -20px;
margin-bottom: -20px;
}

.reDetail dt{
width: 100%;
padding: 0 0 0 20px;
}

.reDetail dt .reListBtn,
.reDetail .reListClose{
cursor: pointer;
position: relative;
padding: 10px 70px 10px 20px;
font-size: 17px;
display: flex;
align-items: flex-start;
background-color: #007ec8;
color: #fff;
width: 30%;
transition : all 0.5s ease 0s;
}

.reDetail .reListClose{
margin: 0 0 0 70%;
}

.ListBtn01:focus-visible .reListBtn,
.ListBtn02:focus-visible .reListBtn,
.ListBtn03:focus-visible .reListBtn,
.ListBtn04:focus-visible .reListBtn,
.ListBtn05:focus-visible .reListBtn,
.ListBtn06:focus-visible .reListBtn,
.ListBtn07:focus-visible .reListBtn,
.ListBtn08:focus-visible .reListBtn,
.ListBtn09:focus-visible .reListBtn,
.reListClose{
outline-color: rgb(59, 153, 252);
outline-offset: 2px;
outline-style: auto;
outline-width: 5px;
}


.reDetail dt .reListBtn:hover,
.reDetail .reListClose:hover {
background-color: #6aa9d0;
}

.reDetail dt .reListBtn:after,
.reDetail .reListClose:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 30px;
  transform: translateY(-50%)  rotate(90deg);
  width: 20px;
  border-top: 2px solid #fff;
  transition: .3s;
}

.reDetail dt .reListBtn:before,
.reDetail .reListClose:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 30px;
  transform: translateY(-50%);
  width: 20px;
  border-top: 2px solid #fff;
}


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

.reDetail dl {
position: static;
top: 0;
margin-bottom: 0;
}

.reDetail dt{
padding: 0 10px;
}

.reDetail dt .reListBtn,
.reDetail .reListClose{
padding: 5px 30px 5px 20px;
font-size: 17px;
width: 100%;
}

.reDetail .reListClose{
margin: 0 0 0 0;
}


.reDetail dt .reListBtn:after,
.reDetail .reListClose:after {
  right: 20px;
  width: 15px;
}

.reDetail dt .reListBtn:before,
.reDetail .reListClose:before {
  right: 20px;
  width: 15px;
}

}

.reDetail dt.open{
height: auto;
}

.reDetail dt.open .reListBtn  {
background-color: #045f95;
}

.reDetail .reListClose.open{
opacity: 1;
}


.reDetail dt.open .reListBtn:after,
.reDetail .reListClose.open:after {
  transform: rotate(180deg);
}

.reDetail dd {
  display: none;
}

.reDetail_contents {
width: 100%;
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-wrap: wrap;
padding: 80px 0;
background-color: #f2f6fb;
border-top: 2px solid #045f95;
border-bottom: 2px solid #045f95;
}


.reDetail_contents h4{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
font-size: 25px;
font-weight: 600;
letter-spacing: 0.1em;
margin: 0 0 60px 0;
padding: 0 0;
position: relative;
}

.reDetail_contents h4:before {
position: absolute;
border-bottom: 4px solid #d80d18;
bottom: -20px;
left: 50%;
transform: translateX(-50%);
width: 35px;
content: '';
}

.reDetail_contents h5{
width: 100%;
font-size: 17px;
font-weight: 400;
letter-spacing: 0.1em;
text-align: center;
margin: 0 0 40px 0;
}

.movieBox{
width: 90%;
margin: 0 5% 60px 5%;
padding: 0 40px 40px 40px;
background-color: #fff;
border: 2px solid #333;
}

.movieBox h4{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
font-size: 22px;
font-weight: 600;
letter-spacing: 0.1em;
margin: 20px 0 20px 0;
position: static;
}

.movieBox h4:before {
display: none;
}

.movie {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.movie iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}


.processSlide_box{
width: 100%;
padding: 0 0 40px 0;
margin: 0 0 80px 0;
}

.processSlide_box div.processSlide{
width: 100%;
}


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

.reDetail_contents {
padding: 40px 0;
}

.reDetail_contents h4{
font-size: 18px;
margin: 0 0 30px 0;
}

.reDetail_contents h5{
font-size: 15px;
margin: 0 0 30px 0;
}

.processSlide_box{
padding: 0 0 40px 0;
margin: 0 0 40px 0;
}


.movieBox{
width: 96%;
margin: 0 2% 60px 2%;
}

.movieBox h4{
font-size: 18px;
margin: 10px 0 30px 0;
}

.movieBox h4:before {
display: none;
}

}



.slick-track {
display: flex !important;
padding-bottom: 20px;
}

.slick-list {
margin: 0 -40px;
}

.slick-slide {
height: auto !important;
margin: 0 40px;
background-color: #fff;
box-shadow: 0px 0px 10px 0px #ccc;
border-radius: 10px;
}

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

.slick-list {
margin: 0 -20px;
}

.slick-slide {
margin: 0 20px;
}

}



.processSlide_img{
width: 100%;
display: flex;
justify-content: center;
align-items: flex-start;
position: relative;
margin: 0 0 10px 0;
}

.processSlide_img img{
border-radius: 10px 10px 0 0;
}

.processSlide_img div.number{
background-color: #fff;
width: 70px;
height: 70px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
bottom: -35px;
left: 50%;
transform: translateX(-50%);
font-size: 20px;
font-weight: 600;
line-height: 50px;
}

.processSlide_box div.processSlide_inner p{
padding: 30px;
}

.processSlide_box div.processSlide_inner p span{
display: block;
}

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

.processSlide_img div.number{
background-color: #fff;
width: 40px;
height: 40px;
bottom: -25px;
font-size: 15px;
line-height: 40px;
}

.processSlide_box div.processSlide_inner p{
padding: 20px 20px;
}

}


.processSlide_box .slide-arrow {
bottom: 0;
position: absolute;
width: 40px;
height: 40px;
font-size: 2rem;
line-height: 50px;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
background-color: #0071bc;
border: 1px solid #000; 
border-radius: 50%;
color: #fff;
transition : all 0.5s ease 0s;
}

.processSlide_box .slide-arrow:hover {
background-color: #6aa9d0;
color: #fff;
}

.processSlide_box .slide-arrow:focus-visible{
outline-color: rgb(59, 153, 252);
outline-offset: 2px;
outline-style: auto;
outline-width: 5px;
}


.processSlide_box .prev-arrow {
left: 50%;
transform: translateX(calc(-50% - 40px));
 z-index:3;
}

.processSlide_box .next-arrow {
left: 50%;
transform: translateX(calc(-50% + 40px));
}

.processSlide_box .prev-arrow.slick-disabled,
.processSlide_box .next-arrow.slick-disabled {
opacity: 0.2 !important;
pointer-events: none;
outline: none !important;
}

.processInfo{
width: 80%;
background-color: #fff;
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
border-radius: 0 10px 10px 0;
margin: 20px 0;
}

.processInfo.right{
border-radius: 10px 0 0 10px;
margin: 20px 0 20px 20%;
}

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

.processInfo{
width: 90%;
flex-direction: column-reverse;
}

.processInfo.right{
flex-direction: column;
margin: 20px 0 20px 10%;
}

}

.processInfo_text{
width: 60%;
background-color: #fff;
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
padding: 20px 30px;
}

.processInfo_text h5{
width: 100%;
font-size: 17px;
line-height: 1;
font-weight: 600;
letter-spacing: 0;
text-align: left;
margin: 0 0 10px 0;
padding: 0 0 0 0;
}

.processInfo_text p{
width: 100%;
margin: 0 0;
padding: 0 0 0 0;
}

.processInfo_img{
width: 40%;
}

.processInfo_img img{
border-radius: 0 10px 10px 0;
}

.right .processInfo_img img{
border-radius: 10px 0 0 10px;
}

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

.processInfo_text{
width: 100%;
padding: 20px 20px;
}

.processInfo_text h5{
font-size: 14px;
}

.processInfo_img{
width: 100%;
}

.processInfo_img img{
border-radius: 0 10px 0 0;
}

.right .processInfo_img img{
border-radius: 10px 0 0 0;
}

}

.interviewBox{
width: 90%;
margin: 20px 5% 40px 5%;
}

.interviewBox h5{
width: 100%;
font-size: 17px;
padding: 20px;
font-weight: 500;
background-color: #fff;
border: 1px solid #000;
border-radius: 10px;
letter-spacing: 0;
text-align: left;
position: relative;
z-index: 1;
}


.interviewBox h5:after {
position: absolute;
content: "";
bottom: -30px;
left: 50%;
transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 20px solid transparent;
  border-left: 20px solid transparent;
  border-top: 30px solid #000;
  border-bottom: 0;
}

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

.interviewBox{
width: 96%;
margin: 10px 2% 20px 2%;
}

.interviewBox h5{
font-size: 14px;
padding: 10px;
border-radius: 10px;
}

.interviewBox h5:after {
bottom: -15px;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  border-top: 15px solid #000;
}

}


.interviewBox .interviewAns{
width: 100%;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-wrap: wrap;
position: relative;
top: -20px;
margin-bottom: -20px;
}

.interviewBox .interviewIcon{
width: 8%;
margin: 0 2% 0 0;
}

.interviewBox p{
background-color: #4693c6;
padding: 30px 30px;
border-radius: 10px;
color: #fff;
display: block;
width: 90%;
font-size: 17px;
position: relative;
}


.interviewBox p:before {
position: absolute;
content: "";
top: 20px;
left: -20px;
width: 0;
height: 0;
border-style: solid;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 20px solid #4693c6;
border-left: 0;
}

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

.interviewBox .interviewIcon{
width: 15%;
margin: 0 10% 0 0;
}

.interviewBox p{
background-color: #4693c6;
padding: 10px 10px;
border-radius: 10px;
color: #fff;
display: block;
width: 75%;
font-size: 14px;
position: relative;
}

}



#choose{
width: 100%;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
}

#choose .inner{
width: 100%;
max-width: 1240px;
margin: 0 auto;
padding: 40px 20px;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
}

#choose h2.sectionTitle{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
margin: 0 0 40px 0;
padding: 10px 0;
font-size: 25px;
font-weight: 600;
color: #000;
border: 1px solid #000;
}


.chooseBox01,
.chooseBox02{
width: 40%;
margin: 0 5%;
transition : all 0.5s ease 0s;
display: block;
}

.chooseBox01 img,
.chooseBox02 img{
transform: translate(10px, 10px);
width: 100%;
transition : all 0.5s ease 0s;
}

.chooseBox01:hover img,
.chooseBox02:hover img{
transform: translate(0, 0);
opacity: 0.6;
}

.chooseBox01{
background-color: #f2e37b;
}

.chooseBox02{
background-color: #0e356e;
}

.chooseBox01 div,
.chooseBox02 div{
position: relative;
width: 100%;
}

.chooseBox01 div p,
.chooseBox02 div p{
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
font-weight: 600;
font-size: 20px;
text-align: center;
}


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

#choose .inner{
width: 96%;
max-width: 96%;
padding: 20px 10px 0 10px;
}


#choose h2.sectionTitle{
margin: 0 0 20px 0;
padding: 5px 0;
font-size: 18px;
}

.chooseBox01{
width: 80%;
margin: 0 10% 40px 10%;
}

.chooseBox02{
width: 80%;
margin: 0 10% 0 10%;
}

.chooseBox01 div p,
.chooseBox02 div p{
font-size: 17px;
}

}