/* ___________________________________

  タイトル
____________________________________ */

.ttlarea {
	background: linear-gradient(to right, rgba(41,43,43,0.5) 0%, rgba(139,140,137,0.5) 100%),url(../img/header-bg.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.ttlarea ul.outer {
	max-width: 1200px;
}
h1.ttl {
	padding: 1em 0;
	color: #fff;
	font-size: 40px;
	font-weight: bold;	
	line-height: 1.2;
}
h1.ttl span.jp {
	color: #fff;
	font-size: 20px;
	display: block;
}


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

   共通セレクタ

------------------------------ */
.contents {
	padding-top: 100px;
	background: #FBFBFB;
}
.container_subpage {
	padding: 0;
}
#wrapper_service {
	padding-bottom: 0;
}

/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	color: #3454D1;
	padding: 0 0 0.5em;
	font-size: 26px;
	text-align: left;
}



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

   共通部分

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

/* 画像
--------------------------- */
.service_ul li.photo img {
	border-radius: 50%;
	border: 10px solid #3454D1;
}



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

   Service details

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

section#service-details {
	margin: 0 0 5%;
}

/* 見出し
--------------------------- */
.service_ul li.txt h2 {
 	line-height: 1.2;
}

/* 画像（左）
--------------------------- */
section#service-details .service_ul {
	margin-bottom: 5%;
}
section#service-details .service_ul.l-img li.photo {
	flex: 0 0 47.5%;
	margin-right: 2.5%;
}
section#service-details .service_ul.l-img li.photo img {
	width: 95%;
	margin: auto;
}

/* テキスト（右）
--------------------------- */
section#service-details .service_ul.l-img li.txt {
	flex: 0 0 47.5%;
	margin-left: 2.5%;
}
section#service-details .service_ul li.txt p {
	margin: 0 0 1em;
	font-size: 20px;
	line-height: 1.7;
}

/* 画像（右）
--------------------------- */
section#service-details .service_ul.r-img li.photo {
	flex: 0 0 47.5%;
	margin-left: 2.5%;
}
section#service-details .service_ul.r-img li.photo img {
	width: 95%;
	margin: auto;
}

/* テキスト（左）
--------------------------- */
section#service-details .service_ul.r-img li.txt {
	flex: 0 0 47.5%;
	margin-right: 2.5%;
}

/* ボタン
--------------------------- */
div.wrapper_btn2 div.wrapper_btn {
	margin-right: 2.5%;
}
div.btn-blue {
	justify-content: flex-start;
}
div.btn-blue a {
  	font-size: 18px;
}


/**
 * レスポンシブ: PC用 ウィンドウ幅1200px以下共通
 */
@media screen and ( max-width:1200px) {	

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

   共通セレクタ

------------------------------ */
.contents {
	padding-top: 54px;
}

/* ___________________________________

  タイトル
____________________________________ */

.ttlarea ul.outer {
	max-width: 94%;
}	
}



/**
 * レスポンシブ: PC用 ウィンドウ幅821px以上、1200px以下
 */
@media screen and (min-width:821px) and ( max-width:1200px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 38px;
}
h1.ttl span.en {
	font-size: 18px;
}
h1.ttl span.jp {
	font-size: 18px;
}
}



/**
 * レスポンシブ: TB用 ウィンドウ幅834px以下共通
 */
@media screen and ( max-width:834px) {
	
/* ___________________________________

  共通セレクタ
____________________________________ */

.container_subpage_inner {
	width: 94%;
	max-width: 94%;
}

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

   共通部分

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

/* 見出し
--------------------------- */	
.service_ul li.txt h2 {
 	display: none;
}	


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

   Service details

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

section#service-details .service_ul li.txt p {
	font-size: 18px;
}
}



/**
 * レスポンシブ: TB用 ウィンドウ幅641px以上、834px以下
 */
@media screen and (min-width:641px) and ( max-width:834px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 36px;
}
h1.ttl span.en {
	font-size: 17px;
}
h1.ttl span.jp {
	font-size: 17px;
}

/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 24px;
}	
}




/**
 * レスポンシブ: SP用 ウィンドウ幅640px以下
 */
@media screen and (max-width:640px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 34px;
}
h1.ttl span.en {
	font-size: 15px;
}
h1.ttl span.jp {
	font-size: 15px;
}	

/* ___________________________________

  コンテンツ
____________________________________ */

.contents {
	padding-top: 50px;
}	

/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 22px;
}	
	


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

   Service details

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

/* レイアウト
--------------------------- */
section#service-details #service-details_ul {
	flex-direction: column;
}
section#service-details .service_ul.r-img {
	flex-direction: column-reverse;
}	

/* 画像
--------------------------- */
section#service-details .service_ul.l-img li.photo, section#service-details .service_ul.r-img li.photo {
	flex: 0 0 auto;
	width: 100%;
	max-width: 100%;
	margin: 0;
}

/* テキスト
--------------------------- */
section#service-details .service_ul.l-img li.txt, section#service-details .service_ul.r-img li.txt {
	flex: 0 0 auto;
	width: 100%;
	max-width: 100%;
	margin: 3% 0 0;
}
section#service-details #service-details_ul li.txt p {
	font-size: 16px;
}

/* ボタン
--------------------------- */
div.wrapper_btn2 {
	justify-content: center;
}	
div.btn-blue {
	justify-content: center;
}	
}



/**
 * レスポンシブ: SP用 ウィンドウ幅480px以下
 */
@media screen and ( max-width:480px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 32px;
}
h1.ttl span.en {
	font-size: 14px;
}


/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 22px;
}


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

   共通部分

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

/* 画像
--------------------------- */
.service_ul li.photo img {
	border: 8px solid #3454D1;
}


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

   Service details

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

/* テキスト
--------------------------- */
section#service-details .service_ul li.txt p {
	font-size: 16px;
}	
}


/**
 * レスポンシブ: SP用 ウィンドウ幅428px以下
 */
@media screen and ( max-width:428px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 30px;
}

/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 22px;
}


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

   共通部分

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

/* 画像
--------------------------- */
.service_ul li.photo img {
	border: 6px solid #3454D1;
}

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

   Service details

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

/* ボタン
--------------------------- */
div.btn-blue a {
	font-size: 16px;
}
}



/**
 * レスポンシブ: SP用 ウィンドウ幅414px以下
 */
@media screen and ( max-width:414px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 28px;
}

/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 22px;
}	
}


/**
 * レスポンシブ: SP用 ウィンドウ幅375px以下
 */
@media screen and ( max-width:375px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 26px;
}


/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 20px;
}
	


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

   Service details

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

/* テキスト
--------------------------- */
section#service-details .service_ul li.txt p {
	font-size: 14px;
}

/* ボタン
--------------------------- */
div.btn-blue a {
	font-size: 15px;
}	
}



/**
 * レスポンシブ: SP用 ウィンドウ幅340px以下
 */
@media screen and ( max-width:340px) {



}


/**
 * レスポンシブ: SP用 ウィンドウ幅320px以下
 */
@media screen and ( max-width:320px) {

/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 24px;
}
h1.ttl span.en {
	font-size: 13px;
}
h1.ttl span.jp {
	font-size: 13px;
}		


/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 18px;
}
}



/**
 * レスポンシブ: SP用 ウィンドウ幅280px以下
 */
@media screen and ( max-width:280px) {
	
/* ___________________________________

  タイトル
____________________________________ */

h1.ttl {
	font-size: 22px;
}


/* ------------------------------
   見出し
------------------------------ */
.container_subpage h2 {
	font-size: 16px;
}	
}