@charset "utf-8";


/*-----「0px-599px」-----*/
/*-------------------------------------------------------------------------------*/


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


/*--------------------「Seg」--------------------*/


/*-----「Base」-----*/


.seg{
	margin-bottom: 40px;
	}

h2{
	font-size: 2.4rem;
	}

h3.h01{
	font-size: 2.0rem;
	}

h3.h01 > span{
	background-image: url(../img/h3_h01-under600.png), url(../img/h3_h01-under600.png);
	padding-right: 35px;
	padding-left: 35px;
	}

h3.h02{
	font-size: 2.0rem;
	}

h3.h02 > span{
	background-image: url(../img/h3_h02-under600.png), url(../img/h3_h02-under600.png);
	padding-right: 35px;
	padding-left: 35px;
	}

h4.h01{
	font-size: 1.8rem;
	}

p.headline01{	/* h2.h01 */
	font-size: 2.4rem;
	}

p.headline02{	/* h3.h01 */
	font-size: 2.0rem;
	}

p.headline03{	/* h3.h02 */
	font-size: 2.0rem;
	}


/*-----「Comp」-----*/


.comp{
	margin-bottom: 30px;
	}

.comp p,
.comp figure{
	margin-bottom: 30px;
	}

.comp figure{
	text-align: center;
	width: 100%;
	}

figure.img_l,
figure.img_r{
	float: none;
	margin-bottom: 30px !important;
	}

figure .img_l,
figure .img_r{
	float: none;
	}

figure .img_l,
figure .img_r,
figure .img_l + img,	/* 隣接セレクタ */
figure .img_r + img{	/* 隣接セレクタ */
	margin: 5px 0 30px !important;
	}

figure .img_r{
	margin: 0 0 0 10px;
	}

figure.img_l + p,
figure.img_r + p{	/* 隣接セレクタ */
	clear: both;
	}

figure.img_l + figure,
figure.img_r + figure{	/* 隣接セレクタ */
	clear: both;
	}


/*-----「リスト（ul・ol）」-----*/


.comp ul,
.comp ol{
	margin-bottom: 30px;
	}


/*-----「定義リスト（dl）」-----*/


.comp dl{
	margin-bottom: 30px;
	}

.sepa li{
	clear: both;
	float: none;
	margin: 0;
	margin-bottom: 0.5em;
	}

.sepa li.col1,
.sepa li.col2,
.sepa li.col3,
.sepa li.col4{
	width: auto;
	}


/*-----「Divi」-----*/


.divi{
	display: block;
	width: 100%;
	margin: 0;
	margin-bottom: 30px;
	}

.divi:last-child{
	margin-bottom: 0;
	}

.divi_cba{
	background-image: url(../img/sp-divi_cba.png);
	}

.rwddce{
	display: block;
	width: 100% !important;
	margin-bottom: 30px;
	}

.rwddce:last-child{
	margin-bottom: 0;
	}

.divi_cba .rwddce{
	margin-bottom: 30px;
	}

.divi_cba .rwddce:last-child{
	margin-bottom: 0;
	}

.divi .flo_l,
.divi .flo_r{
	clear: both;
	float: none;
	margin-bottom: 30px;
	}


/*-----「Sec」-----*/


.sec{
	clear: both;
	float: none;
	width: auto;
	margin: 0 0 10px;
	}


/*-----「RWD」-----*/


.rwdcase0{
	width: 100% !important;
	}

.rwdcase1{
	display: inline;	/* 1200以上で消えて0以上で出現 */
	}

.rwdcase2{
	display: inline;	/* 1200以上で消えて768以上で出現、600以下で出現 */
	}

.rwdcase6{
	display: none;	/* 1200以上で出現1190以下で消える */
	}


/*-------------------「Module」--------------------*/


/*-----「Table」-----*/


table{
	margin-bottom: 30px;
	}


/*-----「RWD用設定（tt01）」-----*/


table.tt01 tr{
	clear: both;
	}

table.tt01 th,
table.tt01 td{
	display: block;
	width: 100% !important;
	border-bottom-width: 0;
	}

table.tt01 tr:last-child th:last-child,
table.tt01 tr:last-child td:last-child{
	border-bottom-width: 1px;
	}

.tt01 thead{
	display: none;
	}


/*-----「スクロールバー」-----*/


.siege{
	margin-bottom: 30px;
	}


/*-----「Horizontal Rule」-----*/


hr{
	margin: 40px 0;
	}


/*--------------------「Main」--------------------*/


/*-----「Header Wide」-----*/


.header_wide{
	min-width: 0;
	}

#top{
	background-image: url(../img/header_wide4.jpg);
	}


/*-----「Header」-----*/


#top header{
	min-height: 260px;
	padding-top: 155.5px;
	}

header h1{
	font-size: 2.8rem;
	background-color: rgba(255,255,255,0.9);
	max-width: 80%;
	padding: 15px 10px;
	}

header .logo{
	width: 210px;
	height: 112.5px;
	left: calc( 50% - 105px);
	}

header .logo img{
	width: auto;
	height: 100%;
	}

header .hp01,
header .hp02{
	width: 30px;
	height: 40px;
	}

header .hp01:after,
header .hp02:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}

header .hp01{
	width: 30px;
	height: 40px;
	top: 12px;
	right: 10px;
	}

header .hp02{
	width: 30px;
	height: 40px;
	top: 12px;
	right: 50px;
	}

header .hp01 img,
header .hp02 img{
	margin-bottom: 7px;
	}

header .hp01 span,
header .hp02 span{
	font-size: 1.0rem;
	line-height: 1;
	color: #6a3906;
	text-align: center;
	display: block;
	}

header .hp01 a:link,
header .hp01 a:visited,
header .hp02 a:link,
header .hp02 a:visited{
	text-decoration: none;
	}

header .hp01 a:active,
header .hp01 a:hover,
header .hp02 a:active,
header .hp02 a:hover{
	color: #6a3906;
	text-decoration: none;
	}

header .menu .boundary_box p.pickup{
	display: block;
	}

header .hp03{
	top: 67px;
	right: 5px;
	}

header .hp04{
	top: 67px;
	left: 5px;
	}

header .hp03 a,
header .hp04 a{
	font-size: 1.2rem;
	letter-spacing: -0.5px;
	background-image: url(../img/icon_login_s01.png);
	background-position: 5px center;
	padding: 10px 15px 10px 30px;
	}

header .hp03 a span,
header .hp04 a span{
	display: block;
	}

header .hp03 a span:nth-of-type(1),
header .hp04 a span:nth-of-type(1){
	letter-spacing: 1px;
	}

header .hp03 a span:nth-of-type(2),
header .hp04 a span:nth-of-type(2){
	margin-top: 2px;
	margin-left: 0;
	}


header .hp03-logout a{
	background-position: 3px center;
	padding: 10px 7px 10px 25px;
	}

header .hp03-logout a span:nth-of-type(1){
	letter-spacing: 0;
	}


/*-----「menu」-----*/


header .menu .menu_btn{
	left: 10px;
	}

header .menu .boundary_box{
	padding: 60px 15px 20px;
	border-radius: 0 0 15px 15px;
	}


/*-「Nav」-*/


.m_wrapper{
	width: 100%;
	margin-right: 0;
	margin-bottom: 20px;
	}

.m_wrapper:last-child{
	margin-bottom: 0;
	}

.mul_c01 li.emphasis{
	display: none;
	}


/*-----「Side Wide」-----*/


.side_wide{
	min-width: 0;
	padding: 40px 0;
	}

.side_wide:nth-of-type(5){
	padding: 40px 0;
	}


/*-----「Side」-----*/


.side{
	width: auto;
	padding: 0 10px;
	}


/*-----「Footer Wide」-----*/


.footer_wide{
	min-width: 0;
	}

.fw02{
	padding: 30px 0 60px;
	}


/*-----「Footer Side」-----*/


.footer_side{
	width: auto;
	padding: 0 20px;
	}


/*-----「Footer Wrapper」-----*/


.fbox p{
	font-size: 1.2rem;
	}

.fbox > div:nth-of-type(1),
.fbox > div:nth-of-type(2){
	width: 100%;
	float: none;
	}

.fbox > div:nth-of-type(1){
	margin-bottom: 20px;
	}

.fbox > div:nth-of-type(1) > figure{
	text-align: center;
	}

.fbox > div:nth-of-type(1) div:nth-of-type(1){
	width: calc((100% - 15px) * 0.3);
	}

.fbox > div:nth-of-type(1) div:nth-of-type(2){
	width: calc((100% - 15px) * 0.7);
	}

.fbox > div:nth-of-type(1) div:nth-of-type(2) p{
	margin-bottom: 10px;
	}


/*-----「Footer」-----*/


#footer{
	height: auto;
	padding: 20px 0;
	}


/*-----「Index」-----*/


#index .side_wide:nth-of-type(5){
	padding: 40px 0;
	}

#index .header_wide + .side_wide{
	padding-bottom: 40px;
	}


/*-----「PickUpBox」-----*/


.pickupbox.pub_s03{	/* 変更20200703 */
	width: calc((100% - (10px * 1)) / 2);
	margin: 0 10px 10px 0;
	background-size: cover;
	}

.pickupbox.pub_s03,
.pickupbox.pub_s03:nth-of-type(4n){	/* 変更20200703 */
	margin-right: 10px;
	}

.pickupbox.pub_s03:nth-of-type(2n){	/* 変更20200703 */
	margin-right: 0;
	}

.pickupbox.pub_s03:nth-last-child(3),
.pickupbox.pub_s03:nth-last-child(4){	/* 変更20200703 */
	margin-bottom:  10px;
	}

.pickupbox.pub_t04{	/* 変更20200703 */
	min-height: 210px;
	}

.pickupbox.pub_t04 .pubc{	/* 変更20200703 */
	padding: 10px 5px 50px;
	}

.pickupbox.pub_t04 .pubc .midashi{	/* 変更20200703 */
	font-size: 1.6rem;
	}


/*-----「CircleBox」-----*/


.circlebox figure{
	margin-bottom: 20px;
	}

.circlebox.cb05 figure,
.circlebox.cb06 figure{
	margin-bottom: 10px;
	}

.circlebox > p{
	display: none;
	}


}


/*-----「0px-479px」-----*//*-----「スマホのポートレート」-----*/
/*-------------------------------------------------------------------------------*/


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


/*--------------------「Common」--------------------*/


.border_on img{
	margin: 0;
	}


/*--------------------「Seg」--------------------*/


/*-----「RWD」-----*/


.rwdcase3{
	display: none;	/* 480以上で出現479以上で消える */
	}

.rwdcase4{
	display: inline;	/* 480以上で消え479以下で出現 */
	}


/*-----「STYLE」-----*/


.srtyle_p01{
	line-height: 1.4;
	}


/*--------------------「Main」--------------------*/


/*-----「Header」-----*/


header .sitetitle{
	left: calc(50% - 75px);
	}

header .sitetitle img{
	width: 150px;
	height: auto;
	}


/*-----「Index」-----*/


#index #top header .slides p{
	font-size: 2.2rem;
	width: 90%;
	padding: 10px;
	top: 56%;
	left: calc(50% - 45%);
	}

#index #top header .slides p span{
	font-size: 1.2rem;
	}


/*-----「PickUpBox」-----*/


.pickupbox.pub2{
	background-image: url(../img/images_index-pub2-2.jpg);
	background-position: center bottom;
	background-size: cover;
	}

.pickupbox.pub_s01,
.pickupbox.pub_s02{
	width: 100%;
	margin: 0 0 15px;
	}

.pickupbox:nth-last-child(1){
	margin-bottom: 0;
	}

.pickupbox.pub_t01,
.pickupbox.pub_t02{
	min-height: 350px;
	}

.pickupbox.pub_t03{
	min-height: 300px;
	}

.pickupbox.pub8-2 figure.ifs01,
.pickupbox.pub8-2 figure.ifs01 iframe{
	height: 300px;
	}

.pickupbox.pub8-2 div{
	min-height: calc(300px * 1 / 5);
	padding-top: calc(((300px * 1 / 5) - 35px) / 2);
	}

.pubc{
	padding: 15px;
	}

.pickupbox.pub7 .pubc{
	padding: 15px 5px;
	}

.pickupbox.pub_t01 .pubc{
	padding-top: 15px;
	border-radius: 0 0 20px 20px;
	top: 50%;
	right: 0;
	bottom: 0;
	left: 0;
	}

.pickupbox.pub_t03 .pubc{
	padding-top: 30px;
	}

.pickupbox.pub_t01 .pubc .midashi,
.pickupbox.pub_t02 .pubc .midashi{
	font-size: 2.2rem;
	margin-bottom: 10px;
	}

.pickupbox.pub_t03 .pubc .midashi{
	font-size: 2.5rem;
	margin-bottom: 10px;
	}

.pickupbox.pub_t01 .pubc .des,
.pickupbox.pub_t02 .pubc .des,
.pickupbox.pub_t03 .pubc .des{
	font-size: 1.2rem;
	}

.pickupbox.pub8.pub_t03 .pubc .des{
	margin-bottom: 10px;
	}

.pickupbox.pub_t01 .pubc p:last-child,
.pickupbox.pub_t02 .pubc p:last-child,
.pickupbox.pub_t03 .pubc p:last-child{
	bottom: 15px;
	}


/*-----「CircleBox」-----*/


.circlebox{
	width: calc((100% - (10px * 1) - 5px) / 2);
	margin: 0 10px 10px 0 !important;
	}

.circlebox.cb02,
.circlebox.cb04,
.circlebox.cb06{
	margin-right: 5px !important;
	}

.circlebox.cb05,
.circlebox.cb06{
	margin-bottom: 5px !important;
	}

.circlebox.cb05 p.headline,
.circlebox.cb06 p.headline{
	letter-spacing: -1px;
	}

.circlebox p.headline03{
	font-size: 1.4rem;
	}


/*-----「藤城矯正歯科について」-----*/


#clinic #top,
#philosophy #top,
#after-follow #top,
#director #top,
#doctor #top,
#staff #top,
#office #top,
#access #top,
#cooperation #top{
	background-image: url(../img/header_wide_clinic479.jpg);
	}

#system #top{
	background-image: url(../img/header_wide_system479.jpg);
	}


/*-----「矯正装置の種類」-----*/


#type #top,
#demand #top,
#metal #top,
#ceramic #top,
#damonsystem #top,
#lingual #top,
#clearaligner #top,
#invisalign #top,
#trial #top{
	background-image: url(../img/header_wide_type479.jpg);
	}


/*-----「矯正歯科治療 体験談」-----*/


#experience .pickupbox.pub_s02{
	width: 100%;
	margin: 0 0 15px;
	}


}


/*-----「480px-599px」-----*//*-----「スマホのランドスケープ」-----*/
/*-------------------------------------------------------------------------------*/


@media only screen and (min-width: 480px) and (max-width: 599px){


/*--------------------「Common」--------------------*/


.comp .rwddivi2 figure.border_on img{
	margin: 0;
	}


/*--------------------「Seg」--------------------*/


/*-----「RWD」-----*/


.rwdcase5{
	display: none;	/* 480以上で消え599以下で出現 */
	}


/*--------------------「Main」--------------------*/


/*-----「Header Wide」-----*/


#top{
	background-image: url(../img/header_wide3.jpg);
	}


/*-----「Index」-----*/


#index #top header .slides p{
	font-size: 2.6rem;
	width: 80%;
	padding: 15px;
	top: 57%;
	left: calc(50% - 40%);
	}

#index #top header .slides p span{
	font-size: 1.4rem;
	}


/*-----「PickUpBox」-----*/


.pickupbox.pub2{
	background-image: url(../img/images_index-pub2-2.jpg);
	background-position: center bottom;
	background-size: cover;
	}

.pickupbox.pub_s01,
.pickupbox.pub_s02{
	width: calc((100% - 15px) / 2);
	margin: 0 15px 15px 0;
	}

.pickupbox:nth-of-type(2),
.pickupbox:nth-of-type(4),
.pickupbox:nth-of-type(6),
.pickupbox:nth-of-type(8){
	margin-right: 0;
	}

.pickupbox:nth-last-child(1),
.pickupbox:nth-last-child(2){
	margin-bottom: 0;
	}

.pickupbox.pub_t01,
.pickupbox.pub_t02,
.pickupbox.pub_t03{
	min-height: 350px;
	}

.pickupbox.pub8-2 figure.ifs01,
.pickupbox.pub8-2 figure.ifs01 iframe{
	height: calc(350px * 4 / 5);
	}

.pickupbox.pub8-2 div{
	min-height: calc(350px * 1 / 5);
	padding-top: calc(((350px * 1 / 5) - 35px) / 2);
	}

.pubc{
	padding: 15px;
	}

.pickupbox.pub7 .pubc{
	padding: 15px 5px;
	}

.pickupbox.pub_t01 .pubc{
	padding-top: 15px;
	border-radius: 0 0 20px 20px;
	top: 50%;
	right: 0;
	bottom: 0;
	left: 0;
	}

.pickupbox.pub_t03 .pubc{
	padding-top: 30px;
	}

.pickupbox.pub_t01 .pubc .midashi,
.pickupbox.pub_t02 .pubc .midashi{
	font-size: 2.2rem;
	margin-bottom: 10px;
	}

.pickupbox.pub4.pub_t02 .pubc .midashi{
	letter-spacing: -1px;
	}

.pickupbox.pub_t03 .pubc .midashi{
	font-size: 2.5rem;
	margin-bottom: 10px;
	}

.pickupbox.pub7 .pubc .midashi{
	font-size: 2.1rem;
	letter-spacing: -1px;
	}

.pickupbox.pub_t01 .pubc .des,
.pickupbox.pub_t02 .pubc .des,
.pickupbox.pub_t03 .pubc .des{
	font-size: 1.2rem;
	}

.pickupbox.pub8.pub_t03 .pubc .des{
	margin-bottom: 10px;
	}

.pickupbox.pub_t01 .pubc p:last-child,
.pickupbox.pub_t02 .pubc p:last-child,
.pickupbox.pub_t03 .pubc p:last-child{
	bottom: 15px;
	}

.pickupbox.pub_t04{	/* 変更20200703 */
	min-height: 230px;
	}

.pickupbox.pub_t04 .pubc{	/* 変更20200703 */
	padding: 15px 10px 50px;
	}

.pickupbox.pub_t04 .pubc .midashi{	/* 変更20200703 */
	font-size: 2.0rem;
	}


/*-----「CircleBox」-----*/


.circlebox{
	width: calc((100% - (10px * 2) - 5px) / 3);
	margin: 0 10px 10px 0 !important;
	}

.circlebox.cb03,
.circlebox.cb06{
	margin-right: 5px !important;
	}

.circlebox.cb04,
.circlebox.cb05,
.circlebox.cb06{
	margin-bottom: 5px !important;
	}

.circlebox.cb05 p.headline,
.circlebox.cb06 p.headline{
	letter-spacing: -1px;
	}

.circlebox p.headline03{
	font-size: 1.5rem;
	}


/*-----「藤城矯正歯科について」-----*/


#clinic #top,
#philosophy #top,
#after-follow #top,
#director #top,
#doctor #top,
#staff #top,
#office #top,
#access #top,
#cooperation #top{
	background-image: url(../img/header_wide_clinic767.jpg);
	}

#system #top{
	background-image: url(../img/header_wide_system767.jpg);
	}


/*-----「矯正装置の種類」-----*/


#type #top,
#demand #top,
#metal #top,
#ceramic #top,
#damonsystem #top,
#lingual #top,
#clearaligner #top,
#invisalign #top,
#trial #top{
	background-image: url(../img/header_wide_type767.jpg);
	}


/*-----「矯正歯科治療 体験談」-----*/


#experience .pickupbox.pub_s02{
	width: calc((100% - 15px) / 2);
	margin: 0 15px 0 0;
	}

#experience .pickupbox:nth-of-type(2){
	margin-right: 0;
	}


}