@charset "utf-8";


/*-----「600px-1199px」-----*/
/*-------------------------------------------------------------------------------*/


@media only screen and (min-width: 600px) and (max-width: 1199px){


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


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


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


/*-----「Comp@Divi」-----*/


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

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

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

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


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


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

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


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


.divi_s01{
	width: calc(100% + 40px);
	margin: -20px;
	margin-bottom: calc(-20px + 35px);
	border-spacing: 20px;
	}

.divi_s01:last-child{
	margin-bottom: -20px;
	}

.rwddivi2{
	display: block;
	width: 100%;
	margin: 0;
	margin-bottom: 35px;
	}

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

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

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

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


.rwddivi2.divi_cba > .rwddce{
	margin-bottom: 35px;
	}

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

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


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


.sec_s01{
	width: calc(50% - 10px);
	margin: 0 10px 10px 0;
	}

.sec_s02{
	width: calc((100% / 3) - 10px);
	margin: 0 10px 10px 0;
	}


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


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


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


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


.header_wide{
	min-width: 0;
	}


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


header h1{
	font-size: 2.8rem;
	max-width: 475px;
	padding: 25px 20px;
	}

header .hp03{
	right: 10px;
	}

header .hp04{
	left: 10px;
	}


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


/*-「Nav」-*/


.mul li{
	margin-bottom: 12px;
	}

.mul li span.nolink,
.mul li a{
	font-size: 1.2rem;
	background-position: left 2px;
	}


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


.side_wide{
	min-width: 0;
	}


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


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


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


.footer_wide{
	min-width: 0;
	}


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


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


/*-----「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: 300px;
	}

.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.pub8-2 figure.ifs01,
.pickupbox.pub8-2 figure.ifs01 iframe{
	height: calc(300px * 4 / 5);
	}

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

.pickupbox.pub_s03{	/* 変更20200703 */
	background-size: cover;
	}

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


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

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

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

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


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


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

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


}


/*-----「600px-959px」-----*/
/*-------------------------------------------------------------------------------*/


@media only screen and (min-width: 600px) and (max-width: 959px){


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


.pickupbox.pub_s03{	/* 変更20200703 */
	width: calc((100% - (30px * 1)) / 2);
	}

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

.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:  30px;
	}


}


/*-----「600px-767px」-----*//*-----「スマホのランドスケープ・タブレットのポートレート 混合」-----*/
/*-------------------------------------------------------------------------------*/


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


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


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


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


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


p.headline02{
	font-size: 1.8rem;
	letter-spacing: -1px;
	}


/*-----「Comp@Divi」-----*/


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

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

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

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


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


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

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


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


.rwddivi1{
	display: block;
	width: 100%;
	margin: 0;
	margin-bottom: 35px;
	}

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

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

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

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


.rwddivi1.divi_cba > .rwddce{
	margin-bottom: 35px;
	}

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

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


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


.sec_c01{
	padding: 9px;
	}


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


.rwdcase0{
	width: 100% !important;
	}


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


.srtyle_p01{
	line-height: 1.4;
	}


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


/*-----「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;
	}


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


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


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


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


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;
	}


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


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

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


/*-「Nav」-*/


.m_wrapper{
	width: calc((100% - (1 * 20px)) / 2);
	margin-right: 20px;
	}

.m_wrapper.m1{
	margin-bottom: 20px;
	}

.m_wrapper.m2{
	margin-right: 0;
	margin-bottom: 20px;
	}

.m_wrapper.m3{
	clear: both;
	margin-right: 20px;
	}

.m_wrapper.m4{
	margin-right: 0;
	}


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


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

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

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

.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;
	}


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


#index #top header .slides p{
	font-size: 2.6rem;
	width: 475px;
	padding: 25px 20px;
	top: 53%;
	left: calc(50% - 237.5px);
	}

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


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


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

.circlebox > p{
	display: none;
	}


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


#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);
	}


}


/*-----「768px-1199px」-----*//*-----「タブレットのポートレート」-----*/
/*-------------------------------------------------------------------------------*/


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


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


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


p.headline02{
	font-size: 2.0rem;
	}


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


.sec_c01{
	padding: 14px;
	}


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


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


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


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


header .hp01{
	right: 10px;
	}

header .hp02{
	right: 127px;
	}


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


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


/*-「Nav」-*/


.m_wrapper{
	width: calc((100% - (3 * 15px)) / 4);
	margin-right: 15px;
	}


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


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

.fbox > div:nth-of-type(2){
	width: calc((100% - 30px) / 2);
	}


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


#index #top header .slides p{
	font-size: 2.6rem;
	width: 475px;
	padding: 25px 20px;
	top: 44%;
	left: calc(50% - 237.5px);
	}

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


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


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

.pickupbox.pub_s02{
	width: calc((100% - (30px * 2)) / 3);
	margin: 0 30px 30px 0;
	}

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

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

.pickupbox.pub_s03{	/* 変更20200703 */
	margin-right: 30px;
	}

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

.pickupbox.pub_s03:nth-last-child(3),
.pickupbox.pub_s03:nth-last-child(4){
	margin-bottom: 30px;
	}

.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);
	}

.pickupbox.pub_t01 .pubc{
	border-radius: 0 0 20px 20px;
	}


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


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

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

.circlebox p.headline{
	margin-bottom: 10px;
	}

.circlebox.cb05 p.headline,
.circlebox.cb06 p.headline{
	margin-bottom: 8px;
	}

.circlebox > p{
	font-size: 1.2rem;
	}


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


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

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


}


/*-----「960px-1199px」-----*//*-----「タブレットのポートレート」-----*/
/*-------------------------------------------------------------------------------*/


@media only screen and (min-width: 960px) and (max-width: 1199px){


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


.pickupbox.pub2{
	background-image: url(../img/images_index-pub2.jpg);
	}

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

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

.pickupbox.pub_t01 .pubc p:last-child{
	bottom: 60px;
	}

.pickupbox.pub_s03{	/* 変更20200703 */
	width: calc((100% - (30px * 2)) / 3);
	}

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

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

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


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


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

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

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

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

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


}